confirm确认对话框的实现方法总结
2016-06-17 10:42
615 查看
还记得之前的javascript入门里的讲的confirm 消息对话框吗?不记得也没关系,我们先来回顾一下,然后在详细讲它。
复习:
confirm 消息对话框通常用于允许用户做选择的动作,如:“你对吗?”等。弹出对话框(包括一个确定按钮和一个取消按钮)。
语法:
confirm(str);
参数说明:
str:在消息对话框中要显示的文本返回值: Boolean值返回值:
当用户点击"确定"按钮时,返回true当用户点击"取消"按钮时,返回false注: 通过返回值可以判断用户点击了什么按钮
看下面的代码:
<script type="text/javascript"> var mymessage=confirm("你喜欢JavaScript吗?"); if(mymessage==true) { document.write("很好,加油!"); } else { document.write("JS功能强大,要学习噢!"); } </script>
结果:
注: 消息对话框是排它的,即用户在点击对话框按钮前,不能进行任何其它操作。
任务
使用confirm()提示框,当点击按钮时,完成性别确认。
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>confirm</title> <script type="text/javascript"> function rec(){ var mymessage=confirm("你是女士!"); if(mymessage==true) { document.write("你是女士!"); } else { document.write("你是男士!"); } } </script> </head> <body> <input name="button" type="button" onClick="rec()" value="点击我,弹出确认对话框" /> </body> </html>
结果:
延伸:
之前有说过,功能的话最好用函数来写,那样的话每一个函数都是一个功能,以后有用到这些功能的话,就可以直接用了。即复用。所以要习惯这样哦。。。。。。
就像上面那个例子
<script language="JavaScript"> function confirm (){ var msg=confirm("你是女士!"); if(msg==true) { document.write("你是女士!"); } else { document.write("你是男士!"); } } </script>
然后给input调用函数,加个onClick="confirm ()"最后对javascript window.confirm做个小结
第一种:
就是上面我们提到的那种方法
<script language="JavaScript"> function confirm (){ var msg=confirm("你是女士!"); if(msg==true) { document.write("你是女士!"); } else { document.write("你是男士!"); } } </script>
<input name="button" type="button" onClick="confirm()" value="点击我,弹出确认对话框" />
第二种:
在标签中写:
1.
<a href="javascript:if(confirm('确实要删除该内容吗?')) location='#'">删除</a>
2 .
<a href="#" onclick= "if(confirm( '确实要删除该内容吗?')==false)return false; ">点击确定</a>
想简单点调用的话 也可以这样
代码如下:
<a href="#" onclick= "return confirm('确实要删除该内容吗?');">删除</a>
第三种:
<script language="JavaScript"> function del_confirm(e) { if (event.srcElement.outerText == "删除") { event.returnValue = confirm("删除是不可恢复的,你确认要删除吗?"); } } document.onclick = delete_confirm; </script>
<a href="#" onClick="del_confirm">删除</a>
第四种:
<script language="JavaScript"> function del_confirm() { event.returnValue = confirm("删除是不可恢复的,你确认要删除吗?"); } </script>
<a href="http://www.baidu.com" onClick="del_confirm()">删除</a>
以上就是小编为大家带来的confirm确认对话框的实现方法总结全部内容了,希望大家多多支持脚本之家~
您可能感兴趣的文章:
相关文章推荐
- MooBox 基于Mootools的对话框插件
- 基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载)
- C#实现在前端网页弹出警告对话框(alert)的方法
- Android开发必知 九种对话框的实现方法
- Android中创建对话框(确定取消对话框、单选对话框、多选对话框)实例代码
- Android列表对话框用法实例分析
- C#使用Word中的内置对话框实例
- MFC对话框中添加状态栏的方法
- jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
- 基于BootStrap Metronic开发框架经验小结【六】对话框及提示框的处理和优化
- JavaScript弹出对话框的三种方式
- 用JavaScript实现对话框的教程
- js中confirm实现执行操作前弹出确认框的方法
- confirm的用法示例用于按钮操作时确定是否执行
- Asp.net 弹出对话框基类(输出alet警告框)
- js弹出框、对话框、提示框、弹窗实现方法总结(推荐)
- boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
- 自制轻量级仿jQuery.boxy对话框插件代码
- jQuery代码实现对话框右上角菜单带关闭×
- 自编jQuery插件实现模拟alert和confirm