模糊事件会停止点击事件 [英] Blur event stops click event

查看:109
本文介绍了模糊事件会停止点击事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

示例代码: http://jsfiddle.net/slolife/PnmxM/

我问这个问题虽然有很多类似的问题,但我觉得它们不一样。

I am asking this even though there are a number of similar questions, but I feel that they are not the same.

我有一个文本框,当它模糊时,应该做点什么。

I have an textbox that when it is blurred, should do something.

我还有一个链接,它总是可见的(似乎是其他问题的区别)当点击时,应该做点什么。

I also have a link, that is always visible (that appears to be how the other questions differ) and when clicked, should do something.

我的模糊处理程序触发,但点击处理程序没有。

My blur handler fires, but the click handler does not.

有没有正确的方法来解决这个问题?

Is there a proper way to deal with this?

更新

很多人指出警报引起了我的问题。谢谢。在我的真实代码中,我没有警报,而是从DOM中删除文本框。

Many people pointed out that the alerts were causing my problem. Thank you. In my real code, I do not have alerts, but instead remove the textbox from the DOM.

所以我更新了小提琴以更好地反映在console.log调用中而不是alert()调用。任何额外的帮助表示赞赏。

So I have updated the fiddle to better reflect that with console.log calls instead of alert() calls. Any additional help is appreciated.

推荐答案

这是因为第一个警报打破第二个警报,因为它是模态的。见:

This is because of the first alert breaking the second alert because it's modal. See this:

  • http://jsfiddle.net/PnmxM/4/

在这里,我将消息附加到 msgs div,它按预期工作。

Here, I'm appending the message to msgs div and it works as expected.

对于你更新的jsFiddle,这是一个(更新更新?)工作的一个:

For your updated jsFiddle, here's an (updated-updated?) working one:

  • http://jsfiddle.net/PnmxM/10/

您正在删除 onBlur <中的输入框/ code>并且,因此,垂直移动添加项,因此点击不会发生在添加项不再(因为你的鼠标指针在此期间没有移动),但是在其他一些元素上(在这种情况下,是一个jsFiddle示例容器)。在消失的输入元素上移动添加项目解决了如果可以的话,请点击我问题。

You are removing the input box in your onBlur and, as a consequence of that, moving the Add item vertically, thus the click doesn't happen on Add item anymore (as your mouse pointer did not move in the meantime), but on some other element (in this case, a jsFiddle example container). Moving Add item above the disappearing input element solves the "click me if you can" issue.

这篇关于模糊事件会停止点击事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆