javascript - 选中另一个复选框时启用点击事件

Question

我需要一个执行以下操作的 jQuery 函数:例如，当 checkbox1 被选中时，当我点击一些其他元素(id 以 element- 开头时>) 我可以在控制台中打印这些元素的 id，如下所示:

$('#checkbox1').click(function() {
    if ($(this).is(':checked')) {
        $(document).on('click','[id^=element-]', function(e) {
            console.log(this.id);
        });
    } else {}
});

我测试了这个例子，但它不工作。我不知道我什么时候错了。

Answer 1

要做到这一点，最简单的方法就是反转您的逻辑。也就是说，将点击处理程序放在所需的元素上，并在其中检查复选框的状态。试试这个:

$(document).on('click', '[id^="element-"]', function(e) {
  if ($('#checkbox1').is(':checked'))
    console.log(this.id);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label>
  <input type="checkbox" id="checkbox1" />
  Check me!
</label>

<div>
  <button id="element-foo">Foo</button>
  <button id="element-bar">Bar</button>
</div>