我见过与 select2 插件一起使用的 JQuery 对话框的示例,在对话框打开时您仍然可以访问下拉框。
我正在尝试对大约 100 行的表格中的模态框执行相同的操作。
就像这样:
<table>
<tr ng-data-repeat="inst in instances"
<td>data bind 1</td>
<td><a href="javascript:void(0)" class="genpopover">click to open dialog</a></td>
</tr>
<tr>
<td>
<div id="modal"></div>
</td>
</tr>
$('body').on("click", ".genpopover", function(){
var $elm = $(this);
var $tbl = $elm.parent().parent().parent().parent();
$("#modal").dialog({ //create dialog, but keep it closed
autoOpen: false,
height: 300,
width: 500,
modal: true,
draggable: false,
position: { my: "right center", at: "right top", of: $tbl},
open: function () {
if ($.ui && $.ui.dialog && !$.ui.dialog.prototype._allowInteractionRemapped && $(this).closest(".ui-dialog").length) {
if ($.ui.dialog.prototype._allowInteraction) {
$.ui.dialog.prototype._allowInteraction = function (e) {
if ($(e.target).closest('table').length) return true;
return ui_dialog_interaction.apply(this, arguments);
};
$.ui.dialog.prototype._allowInteractionRemapped = true;
}
else {
$.error("You must upgrade jQuery UI or else.");
}
}
},
_allowInteraction: function (event) {
return !!$(event.target).is("table") || this._super(event);
}
});
});
最佳答案
如果您不希望对话框为模态,请将模态设置为 false ;-)
根据定义,模态对话框会阻止与其他组件的交互。
关于JQuery 对话框 : Don't disable the background,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23298802/