javascript - 无法在加载了 ajax 调用的 DOM 中聚焦输入字段

Question

我已经发疯了，试图弄清楚如何使这项工作成功。代码大致如下:

function onDropDownChanged() {
  $("#updatePanel").load(
    "myUrl",
    { id: $("#myDropDown option:selected").val() },
    onPanelLoaded
  );
}
function onPanelLoaded() {
  $("#theTextInput").focus();
}
$(document).ready(function() {
  $("#myDropDown").change(onDropDownChanged);
}

第一次触发更改处理程序时，它会进行 ajax 更新，并聚焦文本框。

然而，在随后的更改中，它继续执行 ajax 更新，但文本框再也不会聚焦。

我发现如果在 onDropDownChanged 中，我在 ajax 调用之前添加了 $("#updatePanel").empty()，文本框将始终获得焦点。问题是整个表格会消失一秒钟，导致丑陋的闪光。考虑到 ajax 应该可以让事情变得如此美好，这不是我想要使用的解决方法。

Answer 1

看起来它应该可以工作，但我想知道在调用回调时 DOM 是否没有更新。您可能想看看引入延迟是否有帮助。

function onPanelLoaded() {
     setTimeout( function() { $("#theTextInput").focus(); }, 500 );
}

如果这不起作用，包括页面上的 HTML 和通过 load() 返回的内容将很有帮助。