8

我想在按下 Enter 按钮时运行一个 js 函数。在 IE、Chrome 和 Opera 中一切正常，但在 Safari 中出现错误（如下所述）。

我需要一个纯 Javascript解决方案，而不是 jQuery。

这是功能：

function pressSearch(e) {
    if (typeof e == 'undefined' && window.event) {
        e = window.event;
    }
    var charCode = (e.which) ? e.which : 
                   ((e.charCode) ? e.charCode : 
                   ((e.keyCode) ? e.keyCode : 0));
    if (charCode == 13) {
        document.getElementById('enterSearch').click();
    }
}

这是HTML：

<input type="text" id="searchKey" onkeypress="pressSearch(event)">
<div id="enterSearch">Search</div> // This is the "button"

我收到此错误：

// Safari
TypeError: 'undefined' is not a function 
    (evaluating 'getElementById('enterSearch').click()')

我究竟做错了什么？

编辑：我已经修复了 Mozilla Firefox 错误。

4

5 回答 5

18

如果您查看HTML DOM Level 2 Specification，该click()功能仅定义为HTMLInputElement，因此虽然用户界面不是很友好，但 Safari 不需要实现该功能。

现代浏览器触发事件​​的正确方法是在DOM Level 3 Events中：

// First create an event
var click_ev = document.createEvent("MouseEvents");
// initialize the event
click_ev.initEvent("click", true /* bubble */, true /* cancelable */);
// trigger the event
document.getElementById("someElement").dispatchEvent(click_ev);

这是适用于 Chrome、Safari、Firefox 和 IE9 的 jsfiddle：http: //jsfiddle.net/y5yW9/6/

于 2012-10-06T23:22:48.943 回答
2

您正在触发一个div没有隐式点击处理程序的点击事件。

于 2012-10-06T22:25:56.250 回答
2

我在处理类似问题时遇到了同样的问题。我想出的是在 safari（当然还有其他浏览器）中触发点击事件的以下内容：

var t = document.getElementById('someidhere');
if (document.dispatchEvent) {
    var e = new MouseEvent('click', {
        view: window,    // Window associated with the event
        bubbles: true,
        cancelable: true
    });
    t.dispatchEvent(e);
} else if (document.fireEvent) {
    t.fireEvent('onclick');
} else if (t.click) {
    t.click();
}

根据@Dennis 的说法，您的代码已经适用于 Firefox，但是从 79.0 版（它被测试的版本）开始，这段代码应该可以在 Firefox 中运行。

请注意，initEvent()已弃用。但是，通过 Event 构造函数创建事件的新方法在 Internet Explorer 中不起作用。

于 2012-10-06T22:51:54.277 回答
1

默认情况下，div元素没有定义单击事件处理程序。因此，首先您需要为 enterSearch div 应用点击事件，例如<div id="enterSearch" onclick="submitSearch()">Search</div>. 否则按钮本身将不可点击。

要以编程方式执行事件，请使用以下构造：

function pressSearch(e) {
    if (typeof e == 'undefined' && window.event) {
        e = window.event;
    }

    var charCode = (e.which) ? e.which : ((e.charCode) ? e.charCode : ((e.keyCode) ? e.keyCode : 0));
    if (charCode == 13) {
        var a = document.getElementById('enterSearch');

        if (typeof a.onclick == "function") {
            a.onclick.apply(a); // binds the scope of onclick to a
        }
    }
}

我无法为 IE 验证这一点，但它适用于 Safari。

于 2012-10-06T22:51:37.513 回答
0

getElementById('enterSearch')

应该document.getElementById('enterSearch')

于 2012-10-05T10:28:29.787 回答