jquery - jQuery 切换和切换 :checked

Question

我有一个隐藏的输入框，我正在使用 span 元素来更改复选框的状态，但我无法通过切换选中和未选中来弄清楚如何做到这一点。

$('span.volume').click(function(){
    $(this).toggleClass('active');
    $('#mChatUseSound').toggle(); //this needs to toggle :checked
 });


<span class="volume"></span>
<input type="checkbox" id="mChatUseSound" style="display:none;" /></label>

Answer 1

在这种情况下，如果您使用<label>，则无需编写任何 javascript 来切换选中和取消选中。

<label class="volume" for="mChatUseSound">click</label>
<input type="checkbox" id="mChatUseSound" />

只需要编写脚本来处理其他逻辑：

$('.volume').click(function(){
    $(this).toggleClass('active');
    //More logic
 });

演示

Answer 2

演示

$('#mChatUseSound').prop('checked',function(){return !this.checked}).change();

当我们创建一个闭包时，this将引用集合中的特定元素，这里是“#mChatUseSound”。