时间戳

首页 > 解决方案 > 为什么当我在复选框上触发“更改”事件时，事件对象不会更新为新状态

javascript - 为什么当我在复选框上触发“更改”事件时，事件对象不会更新为新状态

问题描述

我有 2 个元素。出于某种原因，我无法在复选框上触发更改事件并将有关复选框新状态的信息传递给事件方法。

为什么当事件被调用时，checked 属性不能正确显示？

// this works perfectly fine. UI updates. The event method is called and the event e contains the new checked property
$('#mycheckbox').on('change', this.onCheckboxClicked.bind(this));

// this works only partially. UI gets updated. The event methos is called but the event e doesn't contain the checked property.
$('#sometext').on('click', () => $('#mycheckbox').trigger('change'));

function onCheckboxClicked(e) {
  // display true when i click on the checkbox but false when i click on the span. Why ?
  console.log($(e.target).prop('checked'));

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="mycheckbox" />
<span id="sometext">My Text</span>

标签： javascriptjquery

解决方案

问题是您正在触发一个change事件，但这不会更新checked复选框的状态。如果你改变$('#mycheckbox').trigger('change')它$('#mycheckbox').trigger('click')应该工作。

我必须说，尽管您可以使用：

<label for="mycheckbox">My Text</label>

达到同样的效果。

推荐阅读