blocks|key|812981|text|正在获取检查状态|type|unstyled|depth|inlineStyleRanges|entityRanges|data|812982|var+checked+=+$("#selectall").is(":checked");|code-block|syntax|javascript|812983|然后进行设置|812984|$("input:checkbox").attr("checked",checked);|812985|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Getting check status</p>

<pre><code>var checked = $("#selectall").is(":checked");
</code></pre>

<p>Then for setting</p>

<pre><code>$("input:checkbox").attr("checked",checked);
</code></pre>


blocks|key|1027872|text|您可以使用jQuery+.trigger()方法。请参阅http://api.jquery.com/trigger/|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1027873|例如：|1027874|$('#foo').trigger('click');|code-block|syntax|javascript|1027875|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/trigger/^0|C|A|S|U|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@$9|X|A|Y|1|Z]]|E|$]]|$1|F|3|G|5|6|7|10|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|11|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

<p>You can use the jQuery <code>.trigger()</code> method. See <a href="http://api.jquery.com/trigger/" rel="noreferrer">http://api.jquery.com/trigger/</a></p>

<p>E.g.:</p>

<pre><code>$('#foo').trigger('click');
</code></pre>


blocks|key|813098|text|你也可以使用.change()函数|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|813099|例如：|813100|$('form+input[type=checkbox]').change(function()+{+console.log('hello')+});|code-block|syntax|javascript|813101|entityMap^0|6|9|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|R|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|S|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|N|$]]

<p>You can use <code>.change()</code> function too</p>

<p>E.g.:</p>

<pre><code>$('form input[type=checkbox]').change(function() { console.log('hello') });
</code></pre>


blocks|key|813149|text|无gQuery|type|unstyled|depth|inlineStyleRanges|entityRanges|data|813150|document.getElementById('your_box').onclick()；|813151|我在我的checkboxes上使用了某些类。|813152|var+x+=+document.getElementsByClassName("box_class");
var+i;
for+(i+=+0;+i+<+x.length;+i%2B%2B)+{
++++if(x[i].checked)+x[i].checked+=+false;
++++else+x[i].checked+=+true;
++++x[i].onclick();
+++}|code-block|syntax|javascript|813153|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|O|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|P|8|@]|9|@]|A|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>no gQuery</p>

<p>document.getElementById('your_box').onclick();</p>

<p>I used certain class on my checkboxes.</p>

<pre><code>var x = document.getElementsByClassName("box_class");
var i;
for (i = 0; i &lt; x.length; i++) {
    if(x[i].checked) x[i].checked = false;
    else x[i].checked = true;
    x[i].onclick();
   }
</code></pre>


blocks|key|1028017|text|你也可以用这个，我希望你能为他们服务。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1028018|​|1028019|$(function(){
++$('#elements+input[type="checkbox"]').prop("checked",+true).trigger("change");
});|code-block|syntax|javascript|1028020|<script+src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<div+id="elements">
++<input+type="checkbox"+id="item-1"+value="1">+Item+1+<br+/>
++<input+type="checkbox"+id="item-2"+value="2"+disabled>+Item+2+<br+/>+
++<input+type="checkbox"+id="item-3"+value="3"+disabled>+Item+3+<br+/>
++<input+type="checkbox"+id="item-4"+value="4"+disabled>+Item+4+<br+/>
++<input+type="checkbox"+id="item-5"+value="5">+Item+5
</div>|1028021|1028022|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>You can also use this, I hope you can serve them.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(function(){
  $('#elements input[type="checkbox"]').prop("checked", true).trigger("change");
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"&gt;&lt;/script&gt;

&lt;div id="elements"&gt;
  &lt;input type="checkbox" id="item-1" value="1"&gt; Item 1 &lt;br /&gt;
  &lt;input type="checkbox" id="item-2" value="2" disabled&gt; Item 2 &lt;br /&gt; 
  &lt;input type="checkbox" id="item-3" value="3" disabled&gt; Item 3 &lt;br /&gt;
  &lt;input type="checkbox" id="item-4" value="4" disabled&gt; Item 4 &lt;br /&gt;
  &lt;input type="checkbox" id="item-5" value="5"&gt; Item 5
&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1028064|text|++$("#gst_show>input").change(function(){

++++var+checked+=+$(this).is(":checked");
++++if($("#gst_show>input:checkbox").attr("checked",checked)){
++++++alert('Checked+Successfully');
++++}

++});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1028065|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>  $("#gst_show&gt;input").change(function(){

    var checked = $(this).is(":checked");
    if($("#gst_show&gt;input:checkbox").attr("checked",checked)){
      alert('Checked Successfully');
    }

  });
</code></pre>


<p>I have many checkboxes in my page and there is a select all checkbox which checks all the checkboxes. Somehow I want to emulate that click event of checkbox even if it's checked/unchecked through select all button. How can I do it?</p>


How to trigger checkbox click event even if it's checked through Javascript code?

jQuery

我的页面中有许多复选框，并且有一个选中所有复选框的全选复选框。不知何故，我想模拟checkbox单击事件，即使它是通过select all按钮选中/取消选中的。我该怎么做呢？

问如何触发复选框点击事件，即使它是通过Javascript代码检查的？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何触发复选框点击事件，即使它是通过Javascript代码检查的？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何触发复选框点击事件，即使它是通过Javascript代码检查的？
EN