jQuery切换和切换:选中

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将引用set中的特定元素，这里是‘#mChatUse音’。