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

问题描述

我有一个带有Facebox弹出窗口的HTML页面.

I have an HTML page with facebox popup.

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

This page contains many links and forms, and the popup contains one form.What I want is, when I open the popup, using only keyboard's buttons, to go directly to the form's inputs of the popup with 'tab' button.

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

Here is a fiddle --> 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>

如果是这样，我可以使用键盘而不必单击弹出框...这样可以节省我的时间.

If it were so, I might use the keyboard without having to click the popup box... It would save my time.

谢谢.

推荐答案

您可以收听'reveal.facebox'事件，该事件会在显示Facebox之后立即触发.一旦显示了Facebox，只需将焦点放在第一个输入字段即可.

You can listen for the 'reveal.facebox' event which is fired just after the facebox is shown.Once the facebox is shown, just focus the first input field.

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

这篇关于jQuery Facebox插件:关注弹出窗口的外观的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！