防止更新中的复选框prop“checked”

-1

如何防止<input type="checkbox">元素的.checked属性发生更改？防止更新中的复选框prop“checked”

jsFiddle
我希望这段代码是单击该复选框时提醒false，但它提醒true。

var $elem = $('input'); 

function handleToggle(event) { 
    event.preventDefault(); 
    event.stopPropagation(); 

    alert(event.target.checked); 
} 

$elem.bind('change click', handleToggle);

来源

2015-02-06 rojobuffalo

请始终包含问题本身的代码... – 2015-02-06 20:23:40

您没有注意到该复选框未被检查吗？如果您知道您要防止默认操作，那么您知道'！checked'是该属性在事件处理时将具有的值。 – 2015-02-06 20:25:14

它不会改变我。 – j08691 2015-02-06 20:26:07

看来你对preventDefault有什么错误的期望。它只是sets a flag，以便事件处理引擎知道要做什么后事件处理程序已处理。

如果cancelable属性值为true，那么preventDefault（）方法必须设置取消标志。

如何处理该事件是explained here：

运行预单击该元素的激活步骤。

在元素处点击单击事件。 [...]

如果此点击事件未取消，请对元素执行点击后激活步骤。

如果该事件被取消，则用户代理必须在该元素上运行已取消的激活步骤。

This is the specification of what happens when a checkbox is clicked：

如果元素是可变的，那么：pre-click activation steps由设置的元件的checkedness到其相对值（即真实如果是假的，如果其为真），并将元素的不确定IDL属性设置为false。 canceled activation steps由将检查和元素的不确定IDL属性设置回它们在执行预点击激活步骤之前具有的值组成。

因此，您会发现元素的checked属性在事件处理程序执行前设置为相反的值，并且只有在事件被取消时才设置为原始值。但该程序在事件处理程序后运行。

：这似乎是没有经过当前的事件处理本身，而是应该所有事件处理程序被执行。

来源

2015-02-06 20:48:42

是否似乎违反直观地触发“checked”事件，它会更新DOM，而不是提供防止它的方法？在执行流程中，我肯定会期望'preventDefault'后面的内容反映已取消的激活。在其他使用'preventDefault'的情况下，下面的行反映了取消的行为。 – rojobuffalo 2015-02-06 20:59:54

@rblakeley：另一个案例的例子是什么？我只是信使。如果你不喜欢这种行为，你必须把它写给那些编写规范的人。 – 2015-02-06 21:01:10

@ FelixKing：感谢您的关注和研究。我对你一点都不感到沮丧。但是你提倡这种行为吗？我一直都明白'preventDefault'在执行流程中立即生效。但是也许我一直在盲目地在射击场中行走而没有被击中。 – rojobuffalo 2015-02-06 21:15:21

-1

在HTML中，只需向输入元素添加“禁用”即可。

来源

2015-02-06 20:26:40 eszeikial

当检查的属性状态已经更改为true时，将调用该事件。如果您想始终将复选框标记为false，则必须添加条件。虽然我没有看到这样做的感觉。

var $checkbox = $('input[type="checkbox"]'); 

function handleToggle(event) { 
    event.preventDefault(); 
    event.stopPropagation(); 
    if(event.target.checked === true) { 
     event.target.checked = false; 
    } 
    alert(event.target.checked); 
} 

$checkbox.bind('change click', handleToggle);

干杯！

来源

2015-02-06 20:30:30 jcamejo

重点是我想在做'checked'属性改变之前做一些其他的事情。它需要双向工作：选中 - >未选中，未选中 - >选中。我的目标是防止默认行为，做东西，然后更新'checked'属性 – rojobuffalo 2015-02-06 20:37:19

您可以从相反的角度看到这个问题，当更改事件将选中的值交换为true时，可以假设之前的状态是错误的，反之亦然。最后，您可以实现您的逻辑，并按照您希望的方式保留checked属性的状态。 – jcamejo 2015-02-06 20:51:54

@rblakeley：如果你知道事件被阻止，那么你知道'！checked'是复选框*将*具有的值。没有看到问题在这里？ – 2015-02-06 20:55:59

防止更新中的复选框prop“checked”

回答

相关问题