在语义UI中获取切换复选框的价值

Question

我有像这样的HTML语义UI切换复选框设置

<div class="ui toggle mini checkbox">
    <input type="checkbox" name="myLayer">
    <label>myLayer</label>
</div>

我想在复选框切换或取消切换时执行一些操作.现在我写了这个:

$('.ui.toggle').click(function() {
    checked = $('.ui.toggle').is(':checked');
    console.log(checked);
    if (checked === true) {
        myLayer.show();
    }
    else {
        myLayer.hide();
    }
});

但是,无论切换是打开还是关闭,值checked始终false为!为什么会这样？

Answer 1

选择器'.ui.toggle'正在引用输入的父容器.正确的选择器将是'.ui.toggle input'.然后,您还应该为变量获取更改的值.

由于您已经在点击处理程序中,以这种方式搜索输入会更好:$(this).find('input').is(':checked').这样,jQuery不必再次解析整个DOM树以找到输入子节点.