双重触发 onblur 事件答案

【问题标题】：double actuating onblur event双重触发 onblur 事件
【发布时间】：2012-07-01 14:49:49
【问题描述】：

我有 javascript 代码，应该在焦点转移时执行一次。一切正常，但由于某种奇怪的原因，这段代码被执行了两次，因此我给出了两个警报窗口。

$(document).ready(function() {
    $('#username').blur(function() {

        var formData = {
            "username":$('#username').val()
        };

        $.ajax({
            url:'check.php',
            type:'POST',
            data:'jsonData=' + $.toJSON(formData),
            success: function(res) {
                alert(res);
            }

        });
    });
});

我做错了什么？

【问题讨论】：

您是否拥有多个具有id="username" 属性的元素？
好的，如果将alert 替换为console.log 会发生什么？事件还会触发两次吗？
Salman A，是的，它出现了两次。
Here is a jsfiddle with almost your exact code 并且警报只发生一次。您的代码是否有可能运行两次？如果您为“模糊”放置两个事件处理程序，您将获得 ajax 调用...
嗯，我在 Firebug 中看到两个对 check.php 的请求。如果我只发布一次，为什么会发生这种情况？

标签： javascript jquery ajax

【解决方案1】：

当浏览器 window 失去焦点时，某些浏览器（Chrome，也许是 Safari）会触发一个单独的“blur”事件。对我来说这似乎是一个错误，我不知道该怎么办。

详细说明：如果您在 <input> 上有一个“模糊”处理程序，并且它获得了焦点，然后您在浏览器窗口外单击（或 ALT-TAB 到另一个应用程序），那么 Chrome 会触发两个“模糊”事件。这两个事件看起来几乎一样，所以很难说你是否应该注意。

我的最佳建议是在“焦点”和“模糊”上切换一些“类”值或其他东西，并忽略看起来不处于正确“我只是专注”状态的“模糊” .

Here's the question I posted on that issue.

【讨论】：

我遇到了类似的问题，但后来我完全忽略了它（只有 chrome，当然不是 Safari）。现在很高兴知道原因。
如果我将“blur”事件更改为“onclick”事件，此问题仍然存在。所以，我在opera和firefox中也有问题，不仅仅是chrome（或safari）

【解决方案2】：

我将此代码移到#username div 之前，一切正常。

【讨论】：