将焦点设置为IE中的iFrame

Question

我的应用程序中有一个树状菜单,单击菜单项后,它会在iFrame中加载一个URL.我喜欢将焦点设置在iFrame中加载的页面元素中.

我正在使用此代码,它在IE以外的所有浏览器中都能正常运行:

var myIFrame = $("#iframeName");
myIFrame.focus();
myIFrame.contents().find('#inputName').focus();

我尝试了所有不同的选项,比如使用setTimeout,但没有机会.

页面加载后,当我按Tab键时,它转到第二个输入,这意味着它已经在第一个输入,但它没有显示光标!

我正在使用ExtJS和ManagedIFrame插件.

任何帮助表示赞赏.

Answer 1

您需要调用focus()iframewindow对象的方法，而不是 iframe 元素的方法。我不是 jQuery 或 ExtJS 方面的专家，所以我下面的示例两者都没有使用。

function focusIframe(iframeEl) {
    if (iframeEl.contentWindow) {
        iframeEl.contentWindow.focus();
    } else if (iframeEl.contentDocument && iframeEl.contentDocument.documentElement) {
        // For old versions of Safari
        iframeEl.contentDocument.documentElement.focus();
    }
}

Answer 2

iFrame 是在加载时可见，还是稍后显示？元素以不同的顺序创建，这是 setTimeout 方法的基础。您是否在设置的超时上尝试了较高的等待时间？

尝试至少半秒的时间来测试...IE 倾向于以不同的顺序执行操作，因此可能需要较长的超时时间才能使其在渲染/绘制完成之前不触发：

$(function(){
  setTimeout(function() {
    var myIFrame = $("#iframeName");
    myIFrame.focus();
    myIFrame.contents().find('#inputName').focus();
    }, 500);
});