模糊事件会停止点击事件
示例代码: http : //jsfiddle.net/slolife/PnmxM/
即使有许多类似的问题,我也会问这个问题,但我觉得它们不一样。
我有一个文本框,当它模糊时,应该做点什么。
我也有一个链接,它总是可见的(似乎是其他问题的不同),点击后,应该做一些事情。
触发我的模糊处理程序,但点击处理程序不会触发。
有没有正确的方法来解决这个问题?
更新
很多人指出警报引起了我的问题。 谢谢。 在我的真实代码中,我没有警报,而是从DOM中删除文本框。
所以我更新了小提琴以更好地反映使用console.log调用而不是alert()调用。 任何额外的帮助表示赞赏。
这是因为第一个alert
打破了第二个alert
因为它是模态的。 看到这个:
在这里,我将消息附加到msgs
div,它按预期工作。
对于您更新的jsFiddle,这是一个(更新更新?)工作的:
您正在移除onBlur
的输入框,因此,垂直移动Add item
,因此点击不再发生在Add item
(因为您的鼠标指针在此期间没有移动),但是在某些情况下其他元素(在本例中为jsFiddle示例容器)。 移动Add item
在消失的input
元素上方解决了“如果可以的话,请点击我”问题。
click事件未触发,因为只有在释放鼠标按钮时才会触发。 这没有发生,因为有一个模态对话窗口可见(警报窗口)。 如果您将警报更改为console.log
那么它将完美运行…
因为你正在使用alert
你正在中断执行,这导致我在Firefox中出现问题 – 但是如果你切换到console.log
并确保你打开一个控制台(如Firebug),你可以看到两个事件都被触发。
function onBlur() { console.log('blur'); } function addItem() { console.log('add'); } $(document).ready(function() { $('#items').delegate('input','blur', onBlur); $('#addItem').click(addItem); });
根据您的要求,如果您无法重新排列UI,另一种解决方法是简单地绑定到mousedown
事件而不是click
。 我已经添加了我自己的console.log()jsFiddle修改来演示。
我遇到了这个问题,其中的菜单显示用户何时关注文本框,并在模糊时隐藏。 菜单中的点击没有在Chrome中触发,因为模糊隐藏了mousedown上的菜单,所以当鼠标重新启动时,指针不再出现在菜单中(因为它已经消失),因为该处理程序随后被调用在模糊隐藏菜单之前,我的点击事件击中了他们的目标。
只需在更新小提琴http://jsfiddle.net/slolife/PnmxM/后再尝试。
将onBlur函数更新为此。
模糊和点击将有效。
function onBlur() { console.log('blur'); $('#item').val("test"); }
当前的问题是:点击没有触发,因为“添加项目”的ui位置正在改变(因为文本字段消失)。