选中/取消选中一个复选框时,选中/取消选中数组中的所有复选框

时间:2017-12-08 16:52:57

标签: javascript

我正在制作营销偏好表单,我希望顶部的复选框切换“合作伙伴出版物”行中的所有复选框以及“此出版物”的两行中的所有复选框(这些都是选项奏)。出版物有多个部分,每个部分都有自己的全部检查,因此此复选框应仅检查此部分中的所有内容。

我已经将thisPub和partnerPub与以下代码绑定在一起:

var chk344 = $('#optd344');
var chk343 = $('#optd343');

chk343.on('click', function(){
  if( chk343.is(':checked') ) {
    chk344.attr('checked', true);
    }
});

chk502.on('click', function(){
  if( chk502.not(':checked') ) {
    chk501.attr('checked', false);
    }
});

这是我到目前为止在checkAll行为上所做的,但它没有做任何事情:

var chkAllEventsLegal = $('#events-legal-checkthis');
var allEventsLegal = $('#optd343', '#optd344');

chkAllEventsLegal.on('click', function(){
  if( chkAllEventsLegal.not(':checked') ) {
    allEventsLegal.attr('checked', false);
    }
});

chkAllEventsLegal.on('click', function(){
  if( chkAllEventsLegal.is(':checked') ) {
    allEventsLegal.attr('checked', true);
    }
});

请注意,我无法直接编辑所有html(添加类或诸如此类的东西)。它必须通过JS完成。

<div class="subsection-wrapper" id="events-legal-wrapper">
  <div id="eventslegaldonot">I do not wish to receive marketing messages from:</div>
  <div id="eventslegalthispub">This Publication</div>
  <div id="eventslegalpartners">Partners of This Publication</div>
  <hr class="sectionend">
  <span class="subcat-label events-legal">All ALM Legal Events Publications</span>
  <div id="events-legal-checkthis-wrapper"><input class="checkall" id="events-legal-checkthis" type="checkbox"><span class="optoutcheck"></span></div>
  <div id="events-legal-checkpartner-wrapper"><input class="checkall" id="events-legal-checkpartner" type="checkbox"><span class="optoutcheck"></span></div>
  <hr class="sectionend">
  <span class="subcat-label events-legal">ALM Experts Events</span>
  <div id="pd343"><input name="opt10935" value="N" id="optd343" [-checkedopt10935-]="" type="checkbox"><span class="optoutcheck"></span><span class="questionlabel ">ALM Experts Events&nbsp;</span><div id="longd343" class="longdescopt" style="display:none"></div></div>
  <div id="pd344"><input name="opt10936" value="N" id="optd344" [-checkedopt10936-]="" type="checkbox"><span class="optoutcheck"></span><span class="questionlabel ">ALM Experts Events Partner&nbsp;</span><div id="longd344" class="longdescopt" style="display:none"></div></div>

0 个答案:

没有答案