为什么我不能将背景更改为 'true' 或在 Bootstrap 中更改为 'static' 后将其删除?
Why can't I change backdrop to 'true' or remove it after changing to 'static' in Bootstrap?
我想弄清楚为什么在使用 Bootstrap 的模态时将背景更改为 'static' 后无法将背景更改为 'true'。
我运行这个代码:
$('#modal').modal({backdrop: 'static', keyboard: false, show: true});
$.post('server.php', $('#form').serialize(), function(data) {
if(data.success) {
$('#modal').modal({backdrop: true, keyboard: true});
} else {
$('#modal').modal({backdrop: true, keyboard: true});
}
}, 'json');
它会设置背景和键盘在开始时不起作用,但我不明白为什么我不能将它设置回默认值。
感谢阅读。
怎么样this
看起来 Twitter bootstrap 正在将所有数据存储在名为 bs.modal
的数据变量中。所以只需删除该数据变量并重新初始化模态。
您的最终代码将如下所示
$('#modal').modal({backdrop: 'static', keyboard: false, show: true});
$.post('server.php', $('#form').serialize(), function(data) {
if(data.success) {
$('#modal').removeData('bs.modal').modal({backdrop: true, keyboard: true});
} else {
$('#modal').removeData('bs.modal').modal({backdrop: true, keyboard: true});
}
}, 'json');
上述解决方案对我来说效果不佳。
所以我用这个销毁了这个模态实例:-
$('#modal-xl').on('hidden.bs.modal', function (e) {
$("#modal-xl").modal('dispose');
})
跟进 @Cerlin: I could not simply remove all data set to Bootstrap v4.6's modal, since I had other functionality attached to it. Using jQuery v3.6's $.extend(), I was able to modify the data directly to allow the backdrop/keyboard to be usable again. If you don't use jQuery and do not support Internet Explorer, you could always use JavaScript's built-in method Object.assign() 提出的解决方案。
// Variable Defaults
var bootstrapModal = $('.modal');
var bootstrapData = bootstrapModal.data('bs.modal');
// Release Modal Backdrop
bootstrapModal.data('bs.modal', $.extend(true, bootstrapData, {
_config: $.extend(true, bootstrapData._config, {
backdrop: true,
keyboard: true
})
}));
我想弄清楚为什么在使用 Bootstrap 的模态时将背景更改为 'static' 后无法将背景更改为 'true'。
我运行这个代码:
$('#modal').modal({backdrop: 'static', keyboard: false, show: true});
$.post('server.php', $('#form').serialize(), function(data) {
if(data.success) {
$('#modal').modal({backdrop: true, keyboard: true});
} else {
$('#modal').modal({backdrop: true, keyboard: true});
}
}, 'json');
它会设置背景和键盘在开始时不起作用,但我不明白为什么我不能将它设置回默认值。
感谢阅读。
怎么样this
看起来 Twitter bootstrap 正在将所有数据存储在名为 bs.modal
的数据变量中。所以只需删除该数据变量并重新初始化模态。
您的最终代码将如下所示
$('#modal').modal({backdrop: 'static', keyboard: false, show: true});
$.post('server.php', $('#form').serialize(), function(data) {
if(data.success) {
$('#modal').removeData('bs.modal').modal({backdrop: true, keyboard: true});
} else {
$('#modal').removeData('bs.modal').modal({backdrop: true, keyboard: true});
}
}, 'json');
上述解决方案对我来说效果不佳。
所以我用这个销毁了这个模态实例:-
$('#modal-xl').on('hidden.bs.modal', function (e) {
$("#modal-xl").modal('dispose');
})
跟进 @Cerlin: I could not simply remove all data set to Bootstrap v4.6's modal, since I had other functionality attached to it. Using jQuery v3.6's $.extend(), I was able to modify the data directly to allow the backdrop/keyboard to be usable again. If you don't use jQuery and do not support Internet Explorer, you could always use JavaScript's built-in method Object.assign() 提出的解决方案。
// Variable Defaults
var bootstrapModal = $('.modal');
var bootstrapData = bootstrapModal.data('bs.modal');
// Release Modal Backdrop
bootstrapModal.data('bs.modal', $.extend(true, bootstrapData, {
_config: $.extend(true, bootstrapData._config, {
backdrop: true,
keyboard: true
})
}));