jQuery Opera 焦点事件不起作用答案

【问题标题】：jQuery Opera focus event not workingjQuery Opera 焦点事件不起作用
【发布时间】：2015-02-10 20:15:39
【问题描述】：

下面有一个搜索输入和一个复杂的下拉div。当焦点位于输入上时，脚本会显示 div。

它在任何地方都可以正常工作，除了在 Opera 中。在 Opera 中，当我关注输入时，什么也没有发生。但是，如果我点击另一个桌面应用程序，例如查看我的邮件，然后返回网站，网站上的下拉菜单会突然显示。

有什么方法可以解决这个问题？

function checkSf() {
    if ($('#search-field').val() != "" || $('#search-field').is(":focus")){
        $('.search-dropdown').show();
    } 
}
$('#search-field').keyup(function(){
    checkSf()
});

$('#search-field').on('focus', function(){
    checkSf()
});

【问题讨论】：

我没有对元素 keyup 和焦点事件进行 $('#search-field').is(":focus") 的逻辑检查。在这两种情况下，元素都是聚焦的。也就是说，我会尝试使用超时，也许只是 Opera 上的事件堆栈问题

标签： javascript jquery html css opera

【解决方案1】：

其实我找到了答案。此错误与 safari 和 chrome 中的相同。为了解决这个问题，我添加了一个零超时。

奇怪的是它起作用了。

function checkSf() {
    setTimeout(function(){
        if ($('#search-field').val() != "" || $('#search-field').is(":focus")){
            $('.search-dropdown').show();
        } 
    },0);

}

【讨论】：

【解决方案2】：

我认为您的 Javascript 和 JQuery 看起来不错。你的 HTML 设置是这样的吗？如果是这样，这对我有用。

<input type="text" id="search-field" />

<select id="ddlSearch" class="search-dropdown" style="display: none;">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>

【讨论】：