Question

我有一个小脚本，功能非常直接。如果未选中该复选框，则单击用户显示div时，否则在用户单击时隐藏div。该脚本是（它在PHP代码中）：

echo 
'<script> 
$(document).ready(function(){

if($("#chk_id'.$bank_name.'").is(":checked"))
{


   $("#chk_id'.$bank_name.'").click(function(){
      $("#form_show'.$bank_name.'").hide(300);
   });

}
else
{ 

    $("#chk_id'.$bank_name.'").click(function(){

    //alert("ddd");

    $("#form_show'.$bank_name.'").show(300);
   });
}
});    


</script>';

但问题是虽然show div正在运行，但我无法隐藏div！怎么了？ javascript库：<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

Answer 1

试试这个：

$(document).ready(function(){
    $('body').on('click', "#chk_id'.$bank_name.'", function() {
        if($("#chk_id'.$bank_name.'").is(":checked")) {
            $("#form_show'.$bank_name.'").hide(300);
        } else {
            $("#form_show'.$bank_name.'").show(300);
        }
    });
});

Answer 2

我认为你的功能应该是这样的：

function checkBankName(){
    if($("#chk_id'.$bank_name.'").is(":checked"))
    {
        $("#form_show'.$bank_name.'").show(300);
    }
    else
    {
        $("#form_show'.$bank_name.'").hide(300);
    }
}

$(document).ready(function(){
    // first time
    checkBankName();

    // on check
    $("#chk_id'.$bank_name.'").click(function(){
        checkBankName();
    });
});

Answer 3

试试这个：

Demo

 $("#chk_id").click(function(){
       if($('#chk_id:checked').length > 0){
          $('.bank_name').hide(300);
       }
       else{
          $('.bank_name').show(300);
       }
   });

我已经猜到了你的html实现。您可能不需要在选择器中包含#form_show。

或者，你可以使用切换来做这样的事情：

tioggle demo

// code to initialize state before click

$("#chk_id").click(function(){    
    $('.bank_name').toggle(300);            
});

希望这有帮助

Answer 4

这里的另一个答案的简化版本：

$(document).ready(function() {
    $("#chk_id' . $bank_name . '").change(function() {
        $("#form_show' . $bank_name . '")[this.checked ? 'show' : 'hide'](300);
    }).change();
});

jquery复选框检查不起作用

4 个答案: