Question

我们在复选框上使用onclick调用jQuery函数。我们希望该复选框切换其下方的所有复选框。以下是切换复选框的HTML：

    <input type="checkbox" id="toggle" name="toggle" class="daxle_cb" value="" onclick="daxleToggleCB('adminForm');" />

这是功能：

    function daxleToggleCB( formName )
    {
        jQuery('#' + formName).find('input[type=checkbox]').prop('checked', this.checked);
    };

但是，这不起作用。这是什么工作：

    function daxleToggleCB( formName) {
        jQuery( ':checkbox[name=toggle]' ).click
        (
            function ()
            {
                jQuery( '#'+formName ).find( 'input[type=checkbox]' ).prop( 'checked', this.checked );
            }
        ); 
    };

虽然，此功能仅适用于第三次单击复选框。所以问题是让复选框在第一次点击时切换。

Answer 1

首先，你的jQuery.click（）事件没有绑定，直到它被点击一次为止。

然后看起来你有两个事件被解雇。

你有内联的onclick事件，以及jQuery.click事件。

Answer 2

<input type="checkbox" id="toggle" name="toggle" class="daxle_cb" value="" />

看起来像个ID？

$('#toggle').on('change', function() {
    $( this.form ).find('input[type="checkbox"]').prop('checked', this.checked);
})

Answer 3

您的函数定义了使用“onclick”属性调用的函数内部的单击处理程序。相反，这应该在Doc-On-Ready函数内部，以在页面加载时定义单击处理程序而不使用“onclick”属性。

$(function(){
$( ':checkbox[name=toggle]' ).click
    (
        function ()
        {
           //Your Code Here
        }
    );  
 });

Answer 4

您只需在复选框中点击一次即可。此外，您还要将click事件添加到文档中的所有复选框，而不仅仅是form内。所以，重写你的功能：

function daxleToggleCB( formName) {

    $('#'+formName+' input:checkbox').click(function(){
        var $inputs = $('#'+formName+' input:checkbox'); 
        if($(this).is(':checked')){                // <-- is current input checked?
           $inputs.prop('checked',this.checked);   // <-- check all
        }
    });
}

然后将其放在您的文档上以调用该函数：

$(document).ready(daxleToggleCB('myForm'));

Answer 5

$('input[type=checkbox]').click(function(event){
  $(event.currentTarget).val($(event.currentTarget)[0].checked);
});

您可以在所有复选框上使用事件对象来处理事件。这是常见且简短的方法

复选框与jQuery切换

5 个答案: