js怎么模拟confirm的功能
javascript吧
全部回复
仅看楼主
level 1
如题,有个作业模拟confirm功能,但是做不到点击按钮返回true或者false,函数执行了,但是点击事件没有执行,最后返回个undefined。求大佬告知要怎么做才能像自带的confirm一样,
2019年01月06日 11点01分 1
level 5
2019年01月06日 12点01分 2
要是真这么简单,这函数用三元只要写一行就可以了[笑尿]我想楼主要的不是这结果!!!
2019年01月06日 12点01分
不是这样的。。。。不过还是谢谢了[太开心]
2019年01月07日 03点01分
level 5
这个题目需要在confirm这个方法的原型对象toString上进行自定义扩展。说白了就是基于原型扩建
2019年01月15日 09点01分 4
不懂。。。
2019年01月16日 05点01分
level 11
应该是一个弹窗组件吧。你把写的贴出来,帮你修改下
2019年01月15日 12点01分 5
在下面
2019年01月16日 05点01分
level 1
样式:
*{margin:0;padding:0;}
button{cursor:pointer;}
div.pop{width:400px;height: 300px;margin: 100px auto;text-align:center;}
div.pop button{width: 100px;height: 50px;border: 0;border-radius: 10px;outline:none;}
div.msg{position:fixed;left:0;top:0;bottom:0;right:0;background:rgba(0,0,0,.5);display:none;}
.msg .alert,.msg .confirm,.msg .prompt{width: 400px;height:150px;background:#fff;position:absolute;left:0;right: 0;top:0;bottom:0;margin:auto;font:16px/20px "";color:#000;padding: 10px;box-sizing:border-box;display:none;border-radius:5px;}
.msg .mark-sure,.msg .mark-false{position:absolute;right:10px;bottom:10px;background:#2fdecc;border:0;width: 60px;height:40px;border-radius:5px;outline:none;color:#fff;cursor: pointer;}
.msg .mark-false{right: 80px;}
js还有html
<div class="pop">
<button>alert</button>
<button>confirm</button>
<button>prompt</button>
</div>
<div class="msg">
<div class="alert"><span></span> <button class="mark-sure">确定</button></div>
<div class="confirm"><span></span>
<button class="mark-sure" returnMsg ="1">确定</button>
<button class="mark-false" returnMsg="0">取消</button>
</div>
<!-- <div class="prompt"></div> -->
</div>
<script>
var oPop = document.getElementsByClassName("pop")[0];
var oBut = document.getElementsByTagName('button');
var oMsg = document.getElementsByClassName("msg")[0];
var oConfirm = document.getElementsByClassName("confirm")[0];
var myAlertButton = document.getElementsByClassName("mark-sure");
var myAlertButtonFalse = document.getElementsByClassName("mark-false");
oBut[0].onclick = function(){
oMsg.style.display="block";
myAlertMsg('弹窗测试');
oMsg.children[0].style.display="block";
}
oBut[1].onclick = function(){
oMsg.style.display="block";
var r = myConfirmMsg().myConfirmMsg1;
console.log(r("询问框测试"));
oMsg.children[1].style.display="block";
}
//alert 弹窗 没有返回信息
function myAlertMsg(msg){
oMsg.children[0].childNodes[0].innerHTML = msg;
myAlertButton[0].onclick=function(){
oMsg.children[0].style.display="none";
oMsg.style.display="none";
}
}
// confirm(1);
//confirm 提示消息 有返回值
function myConfirmMsg(){
var button = oConfirm.getElementsByTagName("button");
function myConfirmMsg1(msg){
oConfirm.childNodes[0].innerHTML = msg;
return button[0].onclick =function(){//确定
return 1;
}
button[1].onclick =function(){
return 0;
}
}
return {
myConfirmMsg1:myConfirmMsg1
}
}
</script>
2019年01月16日 05点01分 6
level 1
是这样吗
2019年01月16日 07点01分 7
不是。。。。,没事了,老师也没讲,看人讲需要在原型上改
2019年01月17日 09点01分
谢谢了
2019年01月17日 09点01分
level 6
var r = myConfirmMsg().myConfirmMsg1 这个是什么意思
看了你的代码,我头晕脑胀腿抽筋啊
2019年01月16日 07点01分 8
后来乱改改乱了
2019年01月17日 09点01分
代码高深莫测,已膜拜~
2019年01月22日 01点01分
level 12
这个很简单吧。。。
2019年01月16日 07点01分 9
level 12
函数返回值
2019年01月16日 07点01分 10
这个,,,可能我弄错了吧
2019年01月17日 09点01分
1