我已经设置了一个jQuery UI模式对话框,以在用户单击链接时显示。在该对话框div标签中有两个文本框(为简洁起见,我仅显示1的代码),并将其更改为对焦点有反应的jQuery UI DatePicker文本框。
问题在于jQuery UI对话框(“ open”)以某种方式触发了第一个文本框具有焦点,然后触发了日期选择器日历以立即打开。
因此,我正在寻找一种方法来防止焦点自动发生。
<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.0Changelog将故障单4731列出为已修复。
看起来好像没有实现focusSelector,而是使用了对各种元素的级联搜索。从票:
扩展自动对焦,从[自动对焦]开始,然后是:tabbable内容,然后是按钮窗格,然后是关闭按钮,然后是对话框
因此,用autofocus属性标记一个元素,该元素应成为焦点:
autofocus
<input autofocus>
在文档中,对焦点逻辑进行了说明(在目录下,标题为“焦点”):
打开对话框后,焦点将自动移至与以下内容匹配的第一项:
:tabbable