Tim*_*ger 2 jquery jquery-ui-dialog
我在使用jQuery UI MultiSelect小部件搜索过滤器时遇到问题,该过滤器在jQuery对话框中没有获得焦点.通过在浏览器中查看以下HTML页面,可以重现我遇到的问题:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style media="screen" title="currentStyle" type="text/css">
@import "styles/jquery.multiselect.css";
@import "styles/jquery.multiselect.filter.css";
@import "styles/assets/prettify.css";
@import "styles/jquery.ui.all.css";
@import "styles/style.css";
</style>
<script src="scripts/jquery-2.0.0.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script src="scripts/assets/prettify.js"></script>
<script src="scripts/jquery.multiselect.js"></script>
<script src="scripts/jquery.multiselect.filter.js"></script>
</head>
<body>
<input id="create-package" type="button" value="Open Dialog" />
<div id="package-dialog-form" title="Create new package">
<p class="validateTips">All form fields are required.</p>
<form>
<fieldset>
<select multiple="multiple" style="width:370px">
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
<option value="orange">Orange</option>
<option value="purple">Purple</option>
<option value="yellow">Yellow</option>
<option value="brown">Brown</option>
<option value="black">Black</option>
</select>
</fieldset>
</form>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("select").multiselect().multiselectfilter();
$( "#package-dialog-form" ).dialog({
autoOpen: false,
height: 360,
width: 740,
modal: true,
buttons: {
"Create": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
});
$( "#create-package" ).button().click(function() {
$( "#package-dialog-form" ).dialog( "open" );
});
});
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
任何人都可以帮我解决这个问题吗?这是我的问题http://jsfiddle.net/tim_kruger/7ubdE/的分叉jqfiddle .
简单地说这句话:
if ($.ui && $.ui.dialog && $.ui.dialog.prototype._allowInteraction) {
var ui_dialog_interaction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function(e) {
if ($(e.target).closest('.ui-multiselect-filter input').length) return true;
return ui_dialog_interaction.apply(this, arguments);
};
}
Run Code Online (Sandbox Code Playgroud)
在你之后
$(element).dialog("open");
Run Code Online (Sandbox Code Playgroud)
(或者在创建对话框后,如果使用autoOpen:true).
经测试:
| 归档时间: |
|
| 查看次数: |
8073 次 |
| 最近记录: |