我在Salesforce(visualforce)上并使用自定义的自动完成javascript。我的要求是，一旦对另一个文本字段element2的建议做出选择，就会触发对文本字段element1的自动完成搜索。
由于我需要能够使用键盘在自动建议列表中滚动，因此我需要专注于特定 Realm 。在对element2.focus()进行选择并触发对element1的自动建议搜索之后，我当前正在执行element2。
同样，在这些字段上，当搜索正在运行并且用户手动将注意力集中在该字段上时，自动建议会折叠-这表示取消搜索。因此，我无法触发搜索然后调用element2.focus()
以下是不同浏览器中遇到的情况:
Chrome / Firefox 3.5、4 / Safari 5.0.3:
element1的建议中选择一个选项window IE 8:
1.从
element1下的建议中选择一个选项2. Realm 变化的值(value)
3.建议崩溃
4.场模糊，
element2成为焦点5.搜索该字段的火
此外，上述行为上的差异仅在使用鼠标单击进行选择时。当使用击键(上/下然后输入)时，这在所有浏览器中都能正常工作。鼠标和键盘选择都执行相同的javascript方法集。
我为此找到的一个有趣的“修复”是使用
element2.focus()在100 ms之后调用setTimeout()。我猜这是因为element1的onblur干扰了element2.focus()，但我对此并不满意。好吧，有什么想法吗？
代码样例:
//mouseclick handler
function handleMouseClick(event){
element1.value = (event.target)?event.target.textContent:event.srcElement.innerText;
callback();
// kills the children and hides the div containing the suggestions
hideAutoComplete();
}
function callback() {
element2.value = '';
element2.focus();
}
最佳答案
可以使用框架吗？他们确实消除了跨浏览器兼容事件的痛苦。这是一个使用jQuery的简短示例，它似乎可以满足您的要求。任何主要框架都可能对此同样有效。
<html>
<head>
<title>Testing some JS behavior</title>
</head>
<body>
<form id="fooForm">
<label for="a">A: </label><input id="a"/><br />
<label for="b">B: </label><input id="b"/><br />
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
$('#b').focus(function(e) {
alert("Focusing on b now.");
});
$('#a').blur(function(e) {
alert("Doing my business on element A.");
$('#b').focus();
// Stop bubbling, just in case this got triggered by them clicking into B
return false;
});
</script>
</body>
</html>