阻止jQuery UI对话框将焦点设置到第一个文本框
阻止jQuery UI对话框将焦点设置到第一个文本框
提问于 2009-07-29 18:15:32
我已经设置了一个jQuery UI模式对话框来在用户单击链接时显示。在该对话框的div标记中有两个文本框(为简洁起见，我只显示了1的代码)，并且它被更改为对焦点做出反应的jQuery UI DatePicker文本框。
问题是datepicker UI对话框(‘打开’)以某种方式触发第一个文本框具有焦点，然后触发jQuery日历立即打开。
因此，我正在寻找一种方法来防止焦点自动发生。
<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>回答 21
Stack Overflow用户
发布于 2012-05-05 04:16:32
在它上面添加一个隐藏的跨度，使用ui-helper- hidden accessible来通过绝对定位来隐藏它。我知道您有这个类，因为您使用的是jquery-ui中的对话框，而且它在jquery-ui中。
<span class="ui-helper-hidden-accessible"><input type="text"/></span>Stack Overflow用户
发布于 2009-07-29 19:28:03
我找到了下面的代码:用于打开的jQuery UI对话框函数。
c([]).add(d.find(".ui-dialog-content :tabbable:first")).add(d.find(".ui-dialog-buttonpane :tabbable:first")).add(d).filter(":first").focus();您可以解决jQuery行为，也可以更改行为。
tabindex -1是一种变通方法。
Stack Overflow用户
发布于 2009-07-29 18:39:38
将输入的tabindex设置为-1，然后设置dialog.open以在以后需要时恢复tabindex：
$(function() {
$( "#dialog-message" ).dialog({
modal: true,
width: 500,
autoOpen: false,
resizable: false,
open: function()
{
$( "#datepicker1" ).attr("tabindex","1");
$( "#datepicker2" ).attr("tabindex","2");
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1202079
复制相关文章
相似问题