我已经设置了一个jQuery UI模式对话框,以便在用户单击链接时显示.该对话框div标记中有两个文本框(为简洁起见,我只显示了1的代码),它被更改为对焦点作出react 的jQuery UI Datepicker文本框.

The problem is that the jQuery UI dialog('open') somehow triggers the first textbox to have focus, which then triggers the datepicker calendar to open immediately.

所以我在寻找一种方法来防止焦点自动发生.

<div><a id="lnkAddReservation" href="#">Add reservation</a></div>

<div id="divNewReservation" style="display:none" title="Add reservation">
    <table>
        <tr>
            <th><asp:Label AssociatedControlID="txtStartDate" runat="server" Text="Start date" /></th>
            <td>
                <asp:TextBox ID="txtStartDate" runat="server" CssClass="datepicker" />
            </td>
        </tr>
    </table>

    <div>
        <asp:Button ID="btnAddReservation" runat="server" OnClick="btnAddReservation_Click" Text="Add reservation" />
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function() {
        var dlg = $('#divNewReservation');
        $('.datepicker').datepicker({ duration: '' });
        dlg.dialog({ autoOpen:false, modal: true, width:400 });
        $('#lnkAddReservation').click(function() { dlg.dialog('open'); return false; });
        dlg.parent().appendTo(jQuery("form:first"));
    });
</script>

推荐答案

jQuery UI 1.10.0 Changelogticket 4731列为已修复.

Looks like focusSelector was not implemented, but a cascading search for various elements was used instead. From the ticket:

Extend autofocus, starting with [autofocus], then :tabbable content, then buttonpane, then close button, then dialog

因此,用autofocus属性标记一个元素,这就是应该获得焦点的元素:

<input autofocus>

the documentation中,重点逻辑被解释(就在目录下,标题"焦点"下):

Upon opening a dialog, focus is automatically moved to the first item that matches the following:

  1. The first element within the dialog with the autofocus attribute
  2. 对话框内容中的前:tabbable个元素
  3. 对话框按钮平面中的第一个:tabbable元素
  4. The dialog's close button
  5. The dialog itself

Jquery相关问答推荐

如果选中了三个sibling ,则选中一个复选框

哪个 JQuery Select 器会排除与给定 Select 器匹配的父项的项目?

寻找 jQuery 事件类型的完整列表

在 jQuery 中,我想删除 div 中的所有 HTML

在 Javascript 中启用和禁用 Div 及其元素

如何在 Backbone.js - Backbone.sync 或 jQuery.ajax 中保存整个集合?

有没有办法放大 D3 力布局图?

Jquery查找所有以字符串开头的ID?

jQuery 对象和 DOM 元素

如何使用 jQuery UI Resizable 仅水平或垂直调整大小?

如何使用 jQuery Select sibling 元素?

聚焦 时防止 iphone 默认键盘

我可以使用 jQuery 打开下拉列表吗

在jQuery中添加ID?

将每 3 个 div 包装在一个 div 中

测试两个元素是否相同

使用 AJAX 加载 Bootstrap 弹出内容.这可能吗?

jQuery 日期 Select 器 - 禁用过go 的日期

如何使用 jQuery 检测 IE 8?

什么时候应该使用 jQuery 的 document.ready 函数?