怎么用一个变量接收 layer.confirm的bool值
0
所有回答(2)
0
$("#btn").on('click',function(){
var isok=false;
layer.confirm('点击什么',{
bth:['确定','取消']
},function(index){
isok=true;
layer.close(index);
console.log("点击了确定");
},function(){
console.log("点击了取消");
})
alert(isok);
})
你layer.conform{}后的第一个function是指成功后的回调，第二个则是 no后的回调，直接在这两个回调function里给外面isok变量赋值就行。如有不明白，在继续。
这样的话 只会输出false啊。
点击只后还没点确定或者取消，然后就直接输出了isok
@WyhStar: 我测试了一下，已经发现了。稍等一下
@程序人生，永无止境: 是点了确定才会赋值 我能发现的只有这么多了 对了 那个是btn不是bth打错了 不好意思
@WyhStar:
在function内部赋值后alert确实是成功的，只是在外面就不行。我再试试
我刚刚看了一下官方文档，也搜索一下相关问题，网上也有网友有过这样的疑问。layer里面的confirm方法不像js自带的confirm那样先要判断true或false才能执行下一步，layer里的confirm是非阻塞式的，意思是它不会等你执行完了yes或no回调函数的代码以后再去执行外部的js代码，而是已经先执行了layer.confirm()外部的代码。
$("#btn").click(function () {
var isok = false;
layer.confirm("是否继续？", {
}, function () {
isok = true;
layer.alert("yes");
}, function () {
layer.alert("no");
})
alert(isok);
})
像上面这段代码，按照我们的逻辑，应该是先执行回调函数里的代码，再最后执行alert(isok);这一句代码，但是事实上layer他是非阻塞式的。
所以你只能改变代码写法，将要执行的代码在回调函数中执行。
至少目前来说，好像还没发现什么办法可以让它成为阻塞式的执行代码。
@程序人生，永无止境: 嗯 昨天自定义写了一个弹框，但是遇到的问题是一样的。isok是点击之前就赋值了，封装成一个方法也不行 但是老板非要一个变量可以接收true或false 很头疼
$("#btn1").click(function(){
var boo =isok();
console.log(boo);
})
function isok(){
var isokorno;
$(".big-box").css("display","block");
$(".ok").click(function(){
isokorno =true;
$(".big-box").css("display","none");
})
$(".close").click(function(){
isokorno =false;
$(".big-box").css("display","none");
})
return isokorno;
}
一直输出的是undefined 还有其他的办法吗
@WyhStar:
既然别人家框架layer实现不了你想要的结果，又不能用原生js中的comfirn，你老板又非要这样，那可以自己写一个弹出层。
我这里只是写了一个div，用于模拟弹出层，这个div的显示或隐藏用于模拟弹出层中点击了yes或no后的效果，如果是no，则隐藏，表示弹出层消失，如果是yes，则继续显示，当然你也可以把它隐藏。同时在我的yes或no的点击事件中已经给外部变量isok赋值，并且这样赋值能够成功。最后再点击一次弹出按钮，就能够得到isok真正的值。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="../../Scripts/jquery-1.7.1.js"></script> <script> $(function () { var isok = false; $("#btn").click(function () { $("#div-layer").show(); $("input[class='yes']").click(function () { isok = true; }) $("input[class='no']").click(function () { isok = false; $("#div-layer").hide(); }) alert(isok); }) }) </script> </head> <body> <div style="width: 100%; height: auto; margin: auto;"> <input type="button" id="btn" value="点击弹窗" /> <div id="div-layer" style="width: 400px; height: 270px; border: 1px solid gray; background-color: #cbccce; display: none;"> <input type="button" class="yes" value="确认" /> <input type="button" class="no" value="取消" /> </div> </div> </body> </html>
从逻辑上来说，只能到这一步了。
至于弹出层的效果和样式，只要把这个逻辑做通，样式问题都是可以去调整的。想把这个div的显示隐藏做成弹出层的形式，就是你样式的问题了。
最后就总结一句：别人框架无法实现的，而你又一定需要的，并且是合理的可实现的，那么就自己去写。自己的东西想怎么玩就怎么玩，只要不违背规律。
@程序人生，永无止境: 谢谢你
0
试试这个，其实不非要用jquery/zepto
<!DOCTYPE html> <html> <body> <p>Click the button to display a confirm box.</p> <button onclick="myFunction()">Try it</button> <p id="demo"></p> <script> function myFunction() { var txt; var r = confirm("Press a button!"); if (r == true) { txt = "You pressed OK!"; } else { txt = "You pressed Cancel!"; } document.getElementById("demo").innerHTML = txt; } </script> </body> </html>
@CaiYongji 谢谢你的建议 其实意思是想要个自定义的弹出框 所以不能使用confirm 浏览器自带的弹出框是可以阻止的 阻止了就出不来了 除非刷新
@WyhStar: 其实这种标准是顺应浏览器协议设计的，如果那么做是反设计的我个人是不推荐的。
自定义弹出框可以用dialog
@CaiYongji: 这个标签 很多浏览器不支持的吧 我在用promise做 感觉有点眉目吧
@WyhStar:
$('<div></div>').appendTo('body')
.html('<div><h6>Yes or No?</h6></div>')
.dialog({
modal: true, title: 'message', zIndex: 10000, autoOpen: true,
width: 'auto', resizable: false,
buttons: {
Yes: function () {
doFunctionForYes();
$(this).dialog("close");
},
No: function () {
doFunctionForNo();
$(this).dialog("close");
}
},
close: function (event, ui) {
$(this).remove();
}
});
用这个拓展下思路。
