使用jQuery顯示/隱藏父表單的元素

Question

我有一個表單提交按鈕，直到用戶選中一個複選框以表示它們是人類時纔可見（這不是我所知道的最佳做法，但我沒有足夠的控制把一個驗證碼進來）。

下面是HTML：

<div class="row"> 
    <div class="large-5 columns large-centered center" 
     id="txtHuman" style="display:none"> 
    <input class="button" name="submitbutton" type="submit" value="Vote now!" /> 
    </div> 
</div> 

<div class="row"> 

    <div class="large-3 columns large-centered verification"> 
     <label for="isHumanSelected"><span></span></label> 
     <input type="checkbox" id="isHumanSelected" style="margin-left:-9999px"/> 
    </div> 
</div> 

這是jQuery的：

$('#isHumanSelected').click(function() { 
    $("#txtHuman").toggle(this.checked); 
}); 

工程。但是我希望在表單提交按鈕可見時隱藏用於確定用戶是否爲人的複選框和標籤。

我該怎麼做？

Answer 1

您可以使用.parent()隱藏的那些元素，試試這個：

$('#isHumanSelected').click(function() { 
    $("#txtHuman").toggle(this.checked); 
    $(this).parent('.verification').hide(); 
}); 

的Demo Fiddle

Answer 2

<div id="PLACEANIDHERE" class="row"> 

    <div class="large-3 columns large-centered verification"> 
    <label for="isHumanSelected"><span></span></label> 
    <input type="checkbox" id="isHumanSelected" style="margin-left:-9999px"/> 
    </div> 

</div> 

切換容器的ID。標籤和複選框將同時可見/隱藏。

注意：隱藏複選框不會阻止漫遊器提交表單...他們重新創建表單提交，它們實際上並沒有填寫表單。

Answer 3

$("#txtHuman").is(":checked")) 
    $("#element").hide(); 
else 
alert("not:Checked"); 

Answer 4

如何

Live Demo

$(function() { 
    $("#isHumanSelected").on("click",function() { 
    $(this).parent().html($("#txtHuman").html()); 
    }); 
});