如何在IE中重新获得ajax下拉元素的焦点

How to regain focus for an ajax drop-down element in IE?

本文关键字:元素 焦点 ajax 新获得 IE      更新时间:2023-09-26

我有一个下拉元素,它呈现为一个普通的HTML元素。下拉元素在每次更改时使用ajax提交自身。问题是我需要为页面实现一个特定的选项卡顺序。为了防止ajax调用返回时丢失信息的挫败感,我添加了一个屏幕禁用程序,在ajax调用返回之前阻止任何用户交互。还值得注意的是,下一个选项卡顺序元素有时会根据下拉菜单的值而被禁用。

现在,在Firefox和Chrome上一切正常工作,因为当用户离开字段时'change'事件被触发:他按tab键,屏幕禁用程序弹出并要求等待一点,ajax完成后,我的javascript处理下一个元素的tab顺序正确。

然而,IE8/7也有自己的问题。在IE中,下拉框的"更改"事件的触发方式与Firefox/Chrome不同。它在每次更改值时触发。因此,在屏幕禁用功能消失后,我需要再次聚焦到相同的下拉菜单,因为用户可能已经使用了向上或向下箭头键来更改值,并且他可能愿意再次向上/向下下拉菜单。

当Ajax回调回来时,我尝试使用Primefaces'和jQuery的功能来运行某些javascript。然而,它的效果并不好。有时下拉菜单集中了,但随后就失去了重点。我尝试使用javascript的超时,然而,下拉元素以某种方式获得了"不完整"的焦点:按"Tab"键跳到页面顶部,按UP或DOWN箭头键用于跳出下拉框,而不是改变其值。

我的最终解决方案(遗憾的是,仍然不能接受)如下(id是'select'元素的id):

if (jQuery.browser.msie || jQuery.browser.opera) {
    interval = setInterval(function (){
       if (document.activeElement.id != id) {
           document.getElementById(id).focus();
        } else {
            clearInterval(interval);
    }
    }, 500); 
}

这获得了"完整"焦点,TAB和UP/DOWN箭头键的行为符合预期。然而,在稍微慢一点的计算机上,使用UP/DOWN键来改变值的队列间隔太长,有时网站变得不可用。焦点一直跳回下拉框,用户必须等待10秒或更长时间才能清除间隔。

所以,我想问一个更好的解决这个问题的方法。

我认为你应该使用onblur事件的下拉,而不是onchange,这将是正确的解决方案,如果我没理解错的话