2

我想在页面加载/启动后专注于输入文本。这是我的表格：

<form method="post" action="tags">
    <input type="hidden" name="id" id="id" value="getId()" />
    <input type="text" name="tag" id="tag" autofocus="autofocus"/>
    <input type="submit" value="Add" name="add" />
</form>

我尝试了 jQuery，但它在 Firefox 上不起作用：

jQuery(document).ready(function(){
  jQuery("#tag").focus();
});

这是一个使用 Fancybox 作为 iframe 打开的窗口。这是我的 Fancybox 功能：

jQuery(".fancybox").fancybox({
    type: "iframe",
    width: 640,
    height: 320,
    afterClose : function() {
        location.reload();
        return;
    },
    afterShow: function() {
        jQuery('.fancybox-iframe').find('#tag').focus();
    }
});

有解决方法吗？

谢谢！

4

3 回答 3

1

试试这个。

 //change this selector:
$('yourselector').fancybox({
    onComplete: function() {
        $('#fancybox-frame').contents().find('#tag').focus();
    }
});

API 参考

当您将内容加载iframe到$(selector). .contents()虽然.find()方法会。

#fancybox-frame是 fancybox 的默认 ID iframe。加载内容onComplete时触发回调。

经过一些测试，似乎onComplete处理程序触发得太早了。使用超时是一个丑陋的解决方案，因此调整加载的页面应该是一个更好的选择：

<form method="post" action="tags">
    <input type="hidden" name="id" id="id" value="getId()" />
    <input type="text" name="tag" id="tag" />
    <input type="submit" value="Add" name="add" />
</form>
<script>
document.getElementById('tag').focus();
</script>

当它被加载到 iframe 中时，脚本将正常执行并按应有的方式聚焦输入元素。

于 2012-11-06T00:14:49.193 回答
0

你提到了不存在的 id "tag"

<form method="post" action="tags">
    <input type="hidden" name="id" value="getId()" />
    <input type="text" name="tag" id = "tag" autofocus="autofocus"/>
    <input type="submit" value="Add" name="add" />
</form>
于 2012-11-05T23:59:15.483 回答
0

我在回答中省略了 contents() 。在 Fancybox v2.x 中，它类似于：

jQuery(".fancybox").fancybox({
type: "iframe",
width: 640,
height: 320,
afterClose : function() {
    location.reload();
    return;
},
afterShow: function() {
    jQuery('.fancybox-iframe').contents().find('#tag').focus()
}
});

谢谢肯尼迪和法布里西奥·马特。

于 2012-11-06T17:25:33.040 回答