javascript实现确定和取消提示框效果


Posted in Javascript onJuly 10, 2015

在很多网页都有这样的效果,当点击一个按钮或者其他的对象会弹出一个提示框,如果点击确定则继续执行既定的程序,如果点击取消则会取消继续执行,代码实例如下:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>确定和取消提示框</title>
<style type="text/css">
div
{
 width:150px;
 margin:0px auto;
}
a
{
 font-size:12px;
 color:blue;
}
</style>
<script type="text/javascript">
window.onload=function(){
 var mylink=document.getElementById("mytest");
 mylink.onclick=function(){
  if(confirm("确定要访问吗"))
  {
    return true;
  }
  else
  {
    return false;
  }
 }
}
</script>
</head>
<body>
 <div><a href="/" id="mytest">点击跳转</a></div>
</body>
</html>

以上代码中,当点击链接会弹出一个提示框,如果点击确定则会访问蚂蚁部落首页,否则不会访问。实现此功能核心是使用了confirm(),参数值是提示框的文本内容。下面就简短介绍一下以上代码的原理:

一.当点击链接的时候,会调用为a元素绑定的onclick事件处理函数。

二.在事件处理函数中,由于当点击确定按钮,confirm()会返回true,点击取消则会返回false,那么if语句则会根据confirm()的返回值选择执行if语句还是else语句。

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
学习JS面向对象成果 借国庆发布个最新作品与大家交流
Oct 03 Javascript
jquery实现输入框动态增减的实例代码
Jul 14 Javascript
innerText 使用示例
Jan 23 Javascript
Vue.js每天必学之过渡与动画
Sep 06 Javascript
js中获取键盘事件的简单实现方法
Oct 10 Javascript
jQuery File Upload文件上传插件使用详解
Dec 06 Javascript
layui.js实现的表单验证功能示例
Nov 15 Javascript
jQuery NProgress.js加载进度插件的简单使用方法
Jan 31 jQuery
Node.js模块全局安装路径配置方法
May 17 Javascript
微信小程序实现红包雨功能
Jul 11 Javascript
JS实现的tab页切换效果完整示例
Dec 18 Javascript
7个你应该知道的JS原生错误类型
Apr 29 Javascript
javascript实现的简单的表单验证
Jul 10 #Javascript
jQuery原生的动画效果
Jul 10 #Javascript
简述Jquery与DOM对象
Jul 10 #Javascript
JavaScript声明变量名的语法规则
Jul 10 #Javascript
JS控制表单提交的方法
Jul 09 #Javascript
JS获取下拉框显示值和判断单选按钮的方法
Jul 09 #Javascript
JavaScript的类型、值和变量小结
Jul 09 #Javascript
You might like
PHP截断标题且兼容utf8和gb2312编码
2013/09/22 PHP
Linux下PHP加速器APC的安装与配置笔记
2014/10/24 PHP
PHP通过引用传递参数用法分析
2016/12/01 PHP
php定期拉取数据对比方法实例
2019/09/22 PHP
myEvent.js javascript跨浏览器事件框架
2011/10/24 Javascript
jQuery中setTimeout的几种使用方法小结
2013/04/07 Javascript
SpringMVC返回json数据的三种方式
2015/12/10 Javascript
Node.js刷新session过期时间的实现方法推荐
2016/05/18 Javascript
Django1.7+JQuery+Ajax验证用户注册集成小例子
2017/04/08 jQuery
vue通过watch对input做字数限定的方法
2017/07/13 Javascript
vue 项目中使用Loading组件的示例代码
2018/08/31 Javascript
浅谈layui 表单元素的选中问题
2019/10/25 Javascript
vue引用外部JS的两种种方法
2020/01/28 Javascript
使用vue引入maptalks地图及聚合效果的实现
2020/08/10 Javascript
编写v-for循环的技巧汇总
2020/12/01 Javascript
python定时检查启动某个exe程序适合检测exe是否挂了
2013/01/21 Python
浅析Python的Django框架中的Memcached
2015/07/23 Python
详解Python中的元组与逻辑运算符
2015/10/13 Python
对python使用http、https代理的实例讲解
2018/05/07 Python
用Python实现校园通知更新提醒功能
2019/11/23 Python
Python简单实现区域生长方式
2020/01/16 Python
解决python 执行sql语句时所传参数含有单引号的问题
2020/06/06 Python
Html5页面二次分享的实现
2018/07/30 HTML / CSS
美国购买体育赛事门票网站:TicketCity
2019/03/06 全球购物
Guess欧洲官网:美国服饰品牌
2019/08/06 全球购物
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
销售人员个人求职信
2013/09/26 职场文书
教师个人剖析材料
2014/02/05 职场文书
校园歌咏比赛主持词
2014/03/18 职场文书
投资建议书模板
2014/05/12 职场文书
夫妻房产协议书的格式
2014/10/11 职场文书
小班下学期幼儿评语
2014/12/30 职场文书
2016年学生会感恩节活动总结
2016/04/01 职场文书
python自动化之如何利用allure生成测试报告
2021/05/02 Python
Python办公自动化PPT批量转换操作
2021/09/15 Python
用Python生成会跳舞的美女
2022/01/18 Python