Показать/скрыть элементы родительской формы с помощью jQuery

Question

У меня есть кнопка отправки формы, которая не видна, пока пользователь не проверит флажок, чтобы сказать, что они являются людьми (это не лучшая практика, которую я знаю, но мне не хватает для установки Captcha).

Вот 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> 

Переключить идентификатор контейнера. И ярлык, и флажок будут видимы/скрыты одновременно.

Примечание: если флажок не установлен, боты не отправляют вашу форму ... Они воссоздают форму submit, они фактически не заполняют форму.

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()); 
    }); 
});