代码之家 › 专栏 › 技术社区 › tkotitan

jQuery checkbox事件没有触发?

checkbox jquery

tkotitan · 技术社区 · 15 年前

我有一个带有复选框的页面,其中一个是全选按钮。因此,当用户单击全选时,将选中所有其他框,当单击其他框时,将取消选中全选。这是密码。

          $(document).ready(function(event){   
                 //alert('wtf');
            $('#mailSubscribeAll').click(function(event){
                 //alert('wtf');
                $('.mailingCheckbox').attr('checked','checked');
            });             

            $('.mailingCheckbox').bind('click',function(event){
                //alert('wtf');
                $('#mailSubscribeAll').removeAttr('checked');
            });

        });

所以我的页面正在加载jQuery fine,第一个警报触发器。所有单击事件都不会发出警报。我已经仔细检查了我的HTML是否正确。

那么,我是否对jQuery使用了错误的事件,或者我的页面可能与其他不是jQuery的javascript发生冲突?

HTML代码段:

    <tr>
    <td class="CBT3" colspan="3" height="29">
        <input type="checkbox" class="mailingCheckbox" id="mailNewsAlerts"    value="1" {if $smarty.session.profile.mailNewsAlerts}checked{/if} onclick="subscribeMarkProfile()">
        <label for="mailNewsAlerts"><b>News Alerts</b> - <cite>The latest breaking news from XXXXXXX</cite></label>
    </td>
</tr>    
<tr>
    <td class="CBT3" colspan="3" height="29">
        <input type="checkbox" id="mailSubscribeAll"    value="1" {if $smarty.session.profile.mailSubscribeAll}checked{/if} >
        <label for="mailSubscribeAll"><b>Subscribe me to all XXXXX newsletters!</b> </label>
    </td>
</tr>

我还将添加带有复选框的页面部分,当页面加载时不可见,但它在HTML中。我在单击按钮后显示该区域,但是当页面加载时,首先这些复选框是不可见的。

3 回复 | 直到 15 年前

Jan Willem B 15 年前

它按预期工作,代码如下:

<div>
  <input type="checkbox" id="mailSubscribeAll"/>
  <input type="checkbox" class="mailingCheckbox"/>
  <input type="checkbox" class="mailingCheckbox"/>
</div>

<script type="text/javascript">
  $(document).ready(function(event){   
    $('#mailSubscribeAll').click(function(){
      $('.mailingCheckbox').attr('checked','checked');
    });             
    $('.mailingCheckbox').click(function(){
      $('#mailSubscribeAll').removeAttr('checked');
    });
  });    
</script>

Ciantic 15 年前

当以编程方式更改复选框的状态时,还必须检查事件 change ,单击并不总是触发:

$('.mailingCheckbox').bind('change', ...

既然你有两个功能,你应该做如下事情:

function changeMailingCheckbox(...) { ... }
$('.mailingCheckbox').bind('change', changeMailingCheckbox)
$('.mailingCheckbox').bind('click', changeMailingCheckbox)

Tarik 10 年前

 $("input:checkbox #mailSubscribeAll").click(function(event){
   $('.mailingCheckbox').attr('checked','checked');
});

看起来不错,但你现在能试试这个代码吗。

推荐文章

Mickey Vershbow · 无法获取复选框的“checked”属性

2 年前

XAZG ÐÐµÐ¸Ð·Ð²ÐµÑÑÐ½ÑÐ¹ · 如何在for js之后重置字符串变量

2 年前

SãOãNã JãOãã · Google sheets复选标记条件格式化

2 年前

Ranjith Raina · 在jquery中,可以将所有复选框值转换为逗号分隔的字符串

2 年前

Alex · 引导对齐表单开关左侧的标签

2 年前

Khilen Maniyar · 角度2:带有复选框的阵列工作不正常

6 年前

Yash Saraiya · jQuery datatable:在每个分页上启用几个文本框

6 年前

Kais · 带有输入复选框的表格选中/取消选中

6 年前

Silu K · 单击复选框后,如何将之前的所有复选框设置为在angular 4中选中

6 年前

yuggmeister · 如何使自定义复选框可访问?

6 年前