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
 });

DEMO

Answer 2

DEMO

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

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

jQuery切换和切换：选中

2 个答案: