Chrome/Safari 模糊功能支持在 jquery 中检查答案

【问题标题】：Chrome/Safari blur function support checking in jqueryChrome/Safari 模糊功能支持在 jquery 中检查
【发布时间】：2011-05-15 02:43:08
【问题描述】：

我正在尝试检测文件上传输入字段何时更新。在 IE 和 FF 中，如果我使用 blur()，我可以做到这一点，但对于 Chrome，我需要使用 change()。由于 Chrome（我相信 safari）不会触发 blur 事件，jquery.supports 对象中有一个属性来检查这个还是我必须使用已弃用的 .browser 对象？

这是一个示例页面，说明了我的意思，正如下面的海报所说，更改的事件适用于所有三种浏览器，并且是我应该使用的，但我认为获得检测支持的问题的答案仍然很有用模糊事件。

<html>
    <head>
        <script src="jquery-1.4.3.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        $(document).ready(function () {
            $('#test-input').change(function () { alert('changed'); });
            $('#test-input').blur(function () { alert('blurred'); });
            });
        </script>
    </head>
    <body>
        <input type="file" id="test-input">
    </body>
</html>

【问题讨论】：

这些浏览器会正确触发事件...您有示例说明该问题吗？ .change() 应该适用于您所追求的所有浏览器。
你说得对，当我尝试创建一个简单的演示时，所有三个浏览器都触发了更改事件。我怀疑我的代码可能有问题。然而话虽如此，尽管 FF 和 IE 在单击离开时触发了模糊事件，但 chrome 并没有。所以我无论如何都会发布代码，看看a）我的代码是否有问题，或者b）是否有办法检测对功能/错误的支持/不支持。
change() 适用于所有浏览器。如果您担心用户再次选择同一文件时不会再次触发change()，请执行$('form')[0].reset()
很好，只是出于好奇，我仍然想知道是否可以通过 jquery 检测到对模糊事件的非/部分支持而不指定浏览器。

标签： jquery google-chrome blur

【解决方案1】：

尝试使用我无法相信的功能支持您的活动，但是我忘记了我从哪里得到它：

var isEventSupported = function(eventName) { //Function to detect supported events
var el = document.createElement('div');
    eventName = 'on' + eventName;
    var isSupported = (eventName in el);
    if (!isSupported) {
        el.setAttribute(eventName, 'return;');
        isSupported = typeof el[eventName] == 'function';
        }
    el = null;
    return isSupported;
    }

之后定义一个包含你的非此即彼事件的变量：

var ChangeOrBlur = (isEventSupported('blur')) ? 'blur' : 'change'; //with change as your default

然后将您的函数绑定到您喜欢的任何事件：

$('#test-input').bind(ChangeOrBlur, function(){alert(ChangeOrBlur);});

让我知道这对您有什么作用...

【讨论】：