jQuery Facebox插件:关注弹出的外观

jQuery Facebox plugin: Focus the popup appearance

本文关键字：外观 Facebox 插件 jQuery      更新时间：2023-09-26

我有一个带有facebox弹出窗口的HTML页面。

此页面包含许多链接和表单，弹出窗口包含一个表单。我想要的是，当我打开弹出窗口时，只使用键盘的按钮，直接转到带有"选项卡"按钮的弹出窗口的窗体输入。

这是一把小提琴-->http://jsfiddle.net/tk1jagpb/

$(document).ready(function () {
  $('a[rel*=facebox]').facebox()
})
.popup {
  background-color: mistyrose;
}
<p><a href="#info" rel="facebox">Click to display</a></p>
<div id="info" style="display: none;">
  <p>Popup div</p>
  <p><input type="text" value = "" /></p>
  <p><input type="text" value = "" /></p>
  <p><input type="text" value = "" /></p>
  <p><input type="text" value = "" /></p>
</div>
<p><input type="text" value = "" /></p>
<p><input type="text" value = "" /></p>
<p><input type="text" value = "" /></p>

如果是这样的话，我可能不用点击弹出框就可以使用键盘。。。这会节省我的时间。

谢谢。

您可以监听"show.facebox"事件，该事件在facebox显示后立即触发。显示面框后，只需聚焦第一个输入字段即可。

$(document).ready(function() {
    $('a[rel*=facebox]').facebox();
    $(document).bind('reveal.facebox', function() {
        $('.popup input:first').focus();
    });
})
相关文章：