设置焦点到 jHtmlArea jQuery 插件答案

【问题标题】：Set focus to jHtmlArea jQuery plugin设置焦点到 jHtmlArea jQuery 插件
【发布时间】：2009-10-23 20:59:03
【问题描述】：

我在我的页面上使用了 jHtmlArea jQuery 插件，并且我让它在单击按钮时可见。现在我试图将焦点放在 jHtmlArea 编辑器中，一旦它显示出来，但似乎无法到达那里。

我确实找到了这篇博客文章Setting Focus to Control in an IFRAME using jQuery，它正在讨论将焦点设置到 IFrame 内的一个元素，thickbox 插件通过先将焦点设置到 IFrame 然后再设置到元素来利用该元素，但是 jHTMLArea 不会将任何元素放入它的 IFrame。

所以要么我没有正确选择 IFrame 的 body 元素，要么调用 .focus() 到 body 对我没有任何作用。

这是 jHtmlArea 生成的输出：

<div class="jHtmlArea" style="width: 498px;">
  <div class="ToolBar" style="width: 496px;">
    <ul>
      ... removed toolbar code for briefness
    </ul>
  </div>
  <div>
    <iframe style="height: 256px; width: 494px;">
      <html>
        <head>
          <link rel="stylesheet" type="text/css" href="jHtmlArea.Editor.css"></link>
        </head>
        <body>
           <br _moz_editor_bogus_node="TRUE" _moz_dirty=""/>
        </body>
      </html>
    </iframe>
  </div>
  <textarea id="TxtAreaDescription" rows="15" cols="60" name="TxtAreaDescription" style="display: none;"/>

以下是我尝试过的一些方法：

var iframe = $("iframe");
if (iframe != null) {
    $(iframe).focus();
    $(iframe).contents().find("body").focus();
}

感谢您提供的任何帮助。

【问题讨论】：

标签： javascript jquery jquery-plugins focus setfocus

【解决方案1】：

加载：函数（）{ this.iframe[0].contentWindow.focus(); }

【讨论】：

这在大多数正常情况下都可以工作，唯一的问题是我希望 jHtmlArea 出现在模态中并在打开模态时获得焦点。我的解决方案是 $("#BtnToggleDescriptionDisplay").click(function(e) { e.preventDefault(); $("#descriptionHtmlEntry").toggle(); window.setTimeout('$("iframe")[0] .contentWindow.focus()', 30); });