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 相关文章推荐
javascript 控制弹出窗口
Apr 10 Javascript
javascript 动态table添加colspan\rowspan 参数的方法
Jul 25 Javascript
jquery 页面滚动到指定DIV实现代码
Sep 25 Javascript
jquery将一个表单序列化为一个对象的方法
Dec 02 Javascript
动态加载jquery库的方法
Feb 12 Javascript
jQuery 回调函数(callback)的使用和基础
Feb 26 Javascript
轻量级javascript 框架Backbone使用指南
Jul 24 Javascript
Svg.js实例教程及使用手册详解(一)
May 16 Javascript
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
Jun 02 Javascript
require、backbone等重构手机图片查看器
Nov 17 Javascript
用 js 的 selection range 操作选择区域内容和图片
Apr 18 Javascript
jQuery查找dom的几种方法效率详解
May 17 jQuery
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获取windows登录用户名的方法
2014/06/24 PHP
PHPExcel简单读取excel文件示例
2016/05/26 PHP
总结一些PHP中好用但又容易忽略的小知识
2017/06/02 PHP
laravel5.5添加echarts实现画图功能的方法
2019/10/09 PHP
JavaScript基本概念初级讲解论坛贴的学习记录
2009/02/22 Javascript
javascript appendChild,innerHTML,join性能比较代码
2009/08/29 Javascript
基于JQuery的密码强度验证代码
2010/03/01 Javascript
理解JavaScript中的对象 推荐
2011/01/09 Javascript
javascript将url中的参数加密解密代码
2014/11/17 Javascript
基于JS实现简单的样式切换效果代码
2015/09/04 Javascript
javascript Slip.js实现整屏滑动的手机网页
2015/11/25 Javascript
基于JavaScript实现快速转换文本语言(繁体中文和简体中文)
2016/03/07 Javascript
javascript模块化简单解析
2016/04/07 Javascript
JavaScript的模块化开发框架Sea.js上手指南
2016/05/12 Javascript
特殊日期提示功能的实现方法
2016/06/16 Javascript
AngularJS Controller作用域
2017/01/09 Javascript
js记录点击某个按钮的次数-刷新次数为初始状态的实例
2017/02/15 Javascript
深入理解Node中的buffer模块
2017/06/03 Javascript
JavaScript实现点击出现图片并统计点击次数功能示例
2018/07/23 Javascript
js实现黑白div块画空心的图形
2018/12/13 Javascript
Vue 实现登录界面验证码功能
2020/01/03 Javascript
js滚轮事件 js自定义滚动条的实现
2020/01/18 Javascript
详解 Python 读写XML文件的实例
2017/08/02 Python
Python标准库之itertools库的使用方法
2017/09/07 Python
在Django中输出matplotlib生成的图片方法
2018/05/24 Python
Python+selenium点击网页上指定坐标的实例
2019/07/05 Python
python内存管理机制原理详解
2019/08/12 Python
详解Django配置JWT认证方式
2020/05/09 Python
Python Process创建进程的2种方法详解
2021/01/25 Python
俄罗斯购买自行车网站:Vamvelosiped
2021/01/29 全球购物
八年级历史教学反思
2014/01/10 职场文书
《大自然的语言》教学反思
2014/04/08 职场文书
合作经营协议书范本
2014/04/17 职场文书
关于责任的演讲稿
2014/05/20 职场文书
数学教研活动总结
2014/07/02 职场文书
win10重装系统后上不了网怎么办 win10重装系统网络故障的解决办法
2022/07/23 数码科技