带有 iframe 的 JQuery 厚框。将焦点设置到输入字段答案

【问题标题】：JQuery thickbox with iframe. Set focus to input field带有 iframe 的 JQuery 厚框。将焦点设置到输入字段
【发布时间】：2009-06-23 07:05:44
【问题描述】：

您好，我的应用程序中有一个 jquery 厚框 modal popup。（iframe）
一切正常，但我想将焦点设置为 特定输入字段d。

Iframe 加载一个普通的 aspx 页面，所以我想我会做一个 $(document).ready(..focus);
我将该脚本放在 IFrame 代码中

但是这不起作用。我相信在“准备好”之后，thickbox 会执行一些其他代码，使其再次失去焦点。（例如..我可以设置输入字段的值，这样机制就可以工作了..

谁能帮我设置焦点？以下是我的调用代码..

<a href="page.aspx?placeValuesBeforeTB_=savedValues&TB_iframe=true&height=550&width=700" title="Add" class="thickbox">Add</a>

【问题讨论】：

是iframe加载的aspx页面中的$(document).ready(..focus)吗？
是的，我确实把它放在了 iframe 中

标签： javascript jquery iframe thickbox

【解决方案1】：

ThickBox 通过在 iframe 元素的 onload 事件中调用方法来显示 iframe 的容器。由于 iframe 隐藏在父页面上，直到加载 iframe 的内容后，您不能简单地使用 $(document).ready(..focus); 设置焦点。我发现解决此问题的最简单方法是使用 setTimeout 将设置焦点的函数调用延迟到显示 iframe 之后：

jQuery(document).ready(function() {        
    setTimeout(function(){
        $('#YourElementID').focus();   
    },200);
});

注意：您可能需要调整传递给 setTimeout 的毫秒值。

【讨论】：

是的，这就是我最终所做的。所以在这之后，它可能是唯一被接受的解决方案。

【解决方案2】：

来自 docs.jquery.com：

触发每个匹配元素的焦点事件。

这会导致执行所有绑定到焦点事件的函数。请注意，这不会执行底层元素的焦点方法。

这意味着，您的代码更有可能是： $('#input_field').get(0).focus()

不同之处在于，在我的示例中，您使用的是 DOM 元素自己的焦点元素，而在您的示例中，您使用的是 jQuery。

这仍然行不通，但也许是朝着正确方向迈出的一步。

干杯，

【讨论】：

jquery 焦点和普通 javascript 焦点方法都没有达到预期的效果。我认为在我设置焦点后，thickbox 的其他一些方法会接管并关注其他内容..