jQuery 使用 Twitter 引导模式而不是确认对话框
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12218444/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using Twitter bootstrap modal instead of confirm dialog
提问by Ayhan
I am trying to use twitter bootstrap modal instead of custom confirm dialog.
我正在尝试使用 twitter bootstrap 模式而不是自定义确认对话框。
my function
我的功能
function getConfirm(confirmMessage){
if ( confirmMessage == undefined){
confirmMessage = '';
}
$('#confirmbox').modal({
show:true,
backdrop:false,
keyboard: false,
});
$('#confirmMessage').html(confirmMessage);
$('#confirmFalse').click(function(){
$('#confirmbox').modal('hide');
return false;
});
$('#confirmTrue').click(function(){
$('#confirmbox').modal('hide');
return true;
});
}
</script>
<div class="modal" id="confirmbox" style="display: none">
<div class="modal-body">
<p id="confirmMessage">Any confirmation message?</p>
</div>
<div class="modal-footer">
<button class="btn" id="confirmFalse">Cancel</button>
<button class="btn btn-primary" id="confirmTrue">OK</button>
</div>
</div>
calling the function
调用函数
var confimChange=getConfirm("Do You confirm?");
if(confimChange){
alert('perfect you confirmed')
}else{
alert('why didnt you confirmed??')
}
the problem is getConfirm function is not returning true or false.
问题是 getConfirm 函数没有返回 true 或 false。
WORKING CODE:
工作代码:
if(receiverListCount > 0){
var confimChange=confirm("Message");
if(confimChange){
resetReceiverList();
}else{
return false;
}
}
code piece after modifications & changes /not working
修改和更改后的代码段/不工作
if(activeDiv == '#upload'){
if(listOfSelectedGroups.length> 0|| receiverListCount > 0){
getConfirm("message",function(result){
if(result){
resetReceiverList();
}else{
return false;
}
});
}
}
finaly I decided to use bootboxjs
最后我决定使用 bootboxjs
回答by Lloyd
Your approach is wrong, it will execute kind of asynchronously so that it won't wait for the modal dialog to be closed before returning. Try something like this:
您的方法是错误的,它将以异步方式执行,因此它不会在返回之前等待模态对话框关闭。尝试这样的事情:
function getConfirm(confirmMessage,callback){
confirmMessage = confirmMessage || '';
$('#confirmbox').modal({show:true,
backdrop:false,
keyboard: false,
});
$('#confirmMessage').html(confirmMessage);
$('#confirmFalse').click(function(){
$('#confirmbox').modal('hide');
if (callback) callback(false);
});
$('#confirmTrue').click(function(){
$('#confirmbox').modal('hide');
if (callback) callback(true);
});
}
getConfirm('Are you sure?',function(result) {
// Do something with result...
});
Note however you only really need to initialize the modal once and hook the events once. I'd give the modal body and ID and simply change the content before showing.
但是请注意,您实际上只需要初始化一次模态并挂钩一次事件。我会给出模态主体和 ID,并在显示之前简单地更改内容。
You should also set backdrop to true, you want a confirmation to prevent the user from accessing the page until they confirm.
您还应该将背景设置为 true,您需要确认以防止用户在他们确认之前访问该页面。