jQuery UI焦点窃取 [英] jQuery UI Focus Stealing
问题描述
每当我在下面的插入超链接"文本输入中键入内容时,所有单词都将转到其后的textarea
. 确定"和取消"按钮可以正常工作,但我无法专注于文本输入.
Whenever I type something in the following Insert Hyperlink text input, all the words are going to textarea
behind it. OK and Cancel buttons are working fine but I cannot focus to text input.
我们正在使用jQuery UI 1.10.1.它与1.8.x的早期版本的jQuery配合良好.
We'are using jQuery UI 1.10.1. It was working nicely with previous version of jQuery which was 1.8.x.
我已经检查了jQuery的代码,并在打开模态对话框"时调用了以下方法:
I've checked code behind of jQuery and it has the following methods called when opening a Modal Dialog:
_focusTabbable: function () {
// Set focus to the first match:
// 1. First element inside the dialog matching [autofocus]
// 2. Tabbable element inside the content element
// 3. Tabbable element inside the buttonpane
// 4. The close button
// 5. The dialog itself
var hasFocus = this.element.find("[autofocus]");
if (!hasFocus.length) {
hasFocus = this.element.find(":tabbable");
}
if (!hasFocus.length) {
hasFocus = this.uiDialogButtonPane.find(":tabbable");
}
if (!hasFocus.length) {
hasFocus = this.uiDialogTitlebarClose.filter(":tabbable");
}
if (!hasFocus.length) {
hasFocus = this.uiDialog;
}
hasFocus.eq(0).focus();
},
_keepFocus: function (event) {
function checkFocus() {
var activeElement = this.document[0].activeElement,
isActive = this.uiDialog[0] === activeElement ||
$.contains(this.uiDialog[0], activeElement);
if (!isActive) {
this._focusTabbable();
}
}
event.preventDefault();
checkFocus.call(this);
// support: IE
// IE <= 8 doesn't prevent moving focus even with event.preventDefault()
// so we check again later
this._delay(checkFocus);
},
从此处获取的
: http://code.jquery. com/ui/1.10.1/jquery-ui.js
推荐答案
第二个答案是,在以下代码中,jQuery将文档绑定到对话框.因此,当我单击所需按钮的onclick事件(或您要处理的任何事件)时解除绑定时:
Second answer I've found is that in the following code jQuery binds document to dialog. So when I unbind this when I click on the desired button's onclick event (or whatever event you're handling):
if (window.jQuery && window.jQuery.ui.dialog) {
$(document).unbind("focusin.dialog");
}
这是jQuery UI将_focusTabble()
方法绑定到文档的focusin.dialog
事件的地方.
This is where jQuery UI binds it _focusTabble()
method to focusin.dialog
event of document.
if ( !$.ui.dialog.overlayInstances ) {
// Prevent use of anchors and inputs.
// We use a delay in case the overlay is created from an
// event that we're going to be cancelling. (#2804)
this._delay(function() {
// Handle .dialog().dialog("close") (#4065)
if ( $.ui.dialog.overlayInstances ) {
this.document.bind( "focusin.dialog", function( event ) {
if ( !$( event.target ).closest(".ui-dialog").length &&
// TODO: Remove hack when datepicker implements
// the .ui-front logic (#8989)
!$( event.target ).closest(".ui-datepicker").length ) {
event.preventDefault();
$(".ui-dialog:visible:last .ui-dialog-content")
.data("ui-dialog")._focusTabbable();
}
});
}
});
}
这篇关于jQuery UI焦点窃取的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!