stopPropagation()和锚点? [英] stopPropagation() and anchor?

问题描述

我有这个html代码段:

I have this html snippet:

<a href="picture-big.jpg">
  <span>
    <img src="picture-small.jpg">
    <input type="checkbox" name="delete">
  </san>
</a>

还有JS部分:

$('input').click(function(e) {
  e.stopPropagation();
}); 

在Mozilla上，当我单击复选框时，它停止传播，但仍转到该锚点(picture-big.jpg).

On Mozilla, when I'm clicking on checkbox, it's stops propagation, but still goes to that anchor (picture-big.jpg).

如果我使用return false或e.preventDefault()(并使用jQuery检查复选框($('input').prop('checked'，true);)，则不会检查输入.

If I use return false or e.preventDefault() (and checking checkbox with jQuery ($('input').prop('checked', true);) it does not check input.

想法是选中复选框，而不点击链接.在Chrome和IE上可以正常工作.但不是在Mozilla上.

Idea is to check checkbox without following link. On Chrome and IE it's working. But not on Mozilla.

有什么想法吗?

推荐答案

我建议重组您的标记，如果不可能，则可以使用以下方法:

I'd suggest restructuring your markup, if that's not possible, the following would work:

$('input').click(function(e) {
    e.preventDefault();
    var that = this;    
    setTimeout(function() { that.checked = !that.checked; }, 1);    
}); 

这篇关于stopPropagation()和锚点?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！