Javascript 如何将引导框模式的关闭图标限制为关闭模式不触发取消
我已经实现了警报引导盒。我面临着两个我无法解决的问题。 当我点击一个按钮时,会打开一个引导框确认,其中有两个按钮“是”和“否”。但当我点击右上角的“关闭”按钮时,我猜这个框将被关闭,但它却触发了“取消”按钮。另一个问题是,当单击“Esc”按钮时,它也会触发关闭按钮。谁能告诉我如何限制这个问题Javascript 如何将引导框模式的关闭图标限制为关闭模式不触发取消,javascript,jquery,bootstrap-modal,bootbox,Javascript,Jquery,Bootstrap Modal,Bootbox,我已经实现了警报引导盒。我面临着两个我无法解决的问题。 当我点击一个按钮时,会打开一个引导框确认,其中有两个按钮“是”和“否”。但当我点击右上角的“关闭”按钮时,我猜这个框将被关闭,但它却触发了“取消”按钮。另一个问题是,当单击“Esc”按钮时,它也会触发关闭按钮。谁能告诉我如何限制这个问题 $(函数(){ $('.alert')。在('click',function()上{ bootbox.confirm({ 消息:“这是一个带有自定义按钮文本和颜色的确认!您喜欢吗?”, 按钮:{ 确认:{
$(函数(){
$('.alert')。在('click',function()上{
bootbox.confirm({
消息:“这是一个带有自定义按钮文本和颜色的确认!您喜欢吗?”,
按钮:{
确认:{
标签:'是',
类名:“btn btn主”
},
取消:{
标签:‘否’,
类名:“btn btn默认”
}
},
回调:函数(结果){
如果(结果==真){
bootbox.prompt({
标题:“这是一个带有一组复选框输入的提示!”,
类名:“框2”,
回调:函数(结果){
控制台日志(结果);
}
});
}else if(结果==false){
警报(“您没有单击任何按钮”);
}否则{
警报(“有一些错误”);
}
log('这是在回调中记录的:'+结果);
}
});
})
})
内容在这里
$(函数(){
$('.alert')。在('click',function(){
var onSubmit=function(){
//处理表单数据
警报(“提交”);
dialog.modal('hide');
}
var onCancel=函数()
{
bootbox.dialog({
消息:“”,
标题:“自定义标签”,
onEscape:没错,
按钮:{
主要内容:{
标签:“保存”,
类名:“btn主节点”,
回调:函数(){
控制台日志(“保存”);
}
}
}
})
}
var dialog=bootbox.dialog({
消息:“执行此任务?”,
onEscape:没错,
按钮:{
取消:{
标签:‘否’,
类名:“btn默认值”,
回调:onCancel
},
确认:{
标签:'是',
类名:“btn主”,
回调:onSubmit//Handles OK按钮
}
}
});
})
})
这是出于设计,因为这模仿了本机确认对话框的行为。您是否有理由不希望单击“关闭”按钮或单击“取消”按钮得到相同的结果?
<script>
$(function() {
$('.alert').on('click', function() {
var onSubmit = function() {
//Process form data
alert("Submit");
dialog.modal('hide');
}
var onCancel = function()
{
bootbox.dialog({
message: '<input class="form-control input-sm" id="inputsm" type="text">',
title: "Custom label",
onEscape: true,
buttons: {
main: {
label: "Save",
className: "btn-primary",
callback: function() {
console.log("Save");
}
}
}
})
}
var dialog = bootbox.dialog({
message: "Perform this task?",
onEscape: true,
buttons: {
cancel: {
label: 'No',
className: 'btn-default',
callback: onCancel
},
confirm: {
label: 'Yes',
className: 'btn-primary',
callback: onSubmit // Handles OK button
}
}
});
})
})
</script>