实例解析jQuery中如何取消后续执行内容


Posted in Javascript onDecember 01, 2016
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script type="text/javascript">
 //点击a标签,不进行页面跳转
 window.onload = function () {
  var obj = document.getElementById("myhref");
  obj.onclick = function (event) {
  //取消默认行为
  //return false;
  //分浏览器
  //IE下
  //01.第一道能力检测
  event = event || window.event;
  if (event.preventDefault) {

   //非IE下
   event.preventDefault();
  } else {
   event.returnValue = false;
  }  
  };
 }
 </script>
</head>
<body>
 <a id="myhref" href="http://www.baidu.com">去百度</a>
</body>
</html>

这里的a标签的点击效果本来是要跳转到百度页面的,但是我们通过参数取消默认行为的方式可以让这个点击事件的后续内容不执行。

有时候会遇到 同一个标签上点击后有多个事件,如果只想执行第一个事件而放弃后面的事件,可以加上一段代码来阻止:

<span onclick="alert('后面的不会执行了!');event.stopPropagation();">click me!</span>

jquery怎阻止后绑定的事件

你的代码在页面载入过程中已经完成事件绑定了,没有阻止后绑定的事件的办法了,不过可以删除当前指定节点的事件绑定。方法如下:

$("#btn").click(function(){
if($("#tx").val()==""){
alert("e1");
}else{
//删除后绑定的事件。。。
$("#btn").unbind('click');
}
});

说明:

unbind([type],[data])
bind()的反向操作,从每一个匹配的元素中删除绑定的事件。

如果没有参数,则删除所有绑定的事件。

你可以将你用bind()注册的自定义事件取消绑定。

I如果提供了事件类型作为参数,则只删除该类型的绑定事件。

如果把在绑定时传递的处理函数作为第二个参数,则只有这个特定的事件处理函数会被删除。

jquery:怎可以阻止第二次点击click事件?

jquery提供了一个只触发一次点击的方法

obj.one(function(){
});

或者用obj.unbind("click")取消点击事件

以上就是本文的全部内容,希望对大家有所帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript之Getters和Setters 平台支持等详细介绍
Dec 07 Javascript
动态标签 悬停效果 延迟加载示例代码
Nov 21 Javascript
javascript常见操作汇总
Sep 03 Javascript
使用jquery菜单插件HoverTree仿京东无限级菜单
Dec 18 Javascript
JS制作手机端自适应缩放显示
Jun 11 Javascript
Javascript iframe交互并兼容各种浏览器的解决方法
Jul 12 Javascript
jquery实现tab键进行选择后enter键触发click行为
Mar 29 jQuery
vue中的scope使用详解
Oct 29 Javascript
jquery ztree实现右键收藏功能
Nov 20 jQuery
Vue 项目部署到服务器的问题解决方法
Dec 05 Javascript
AngularJS双向数据绑定原理之$watch、$apply和$digest的应用
Jan 30 Javascript
vue自定义右键菜单之全局实现
Apr 09 Vue.js
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
Dec 01 #Javascript
jQuery中ajax错误调试分析
Dec 01 #Javascript
JQuery学习总结【二】
Dec 01 #Javascript
Vue.js第二天学习笔记(vue-router)
Dec 01 #Javascript
JavaScript给每一个li节点绑定点击事件的实现方法
Dec 01 #Javascript
Vue方法与事件处理器详解
Dec 01 #Javascript
简单理解vue中实例属性vm.$els
Dec 01 #Javascript
You might like
《OVERLORD》手游英文版即将上线 手机上也能扮演骨王
2020/04/09 日漫
php中通过虚代理实现延迟加载的实现代码
2011/06/10 PHP
关于PHP语言构造器介绍
2013/07/08 PHP
PHP数字和字符串ID互转函数(类似优酷ID)
2014/06/30 PHP
php采集内容中带有图片地址的远程图片并保存的方法
2015/01/03 PHP
PHP连接Nginx服务器并解析Nginx日志的方法
2015/08/16 PHP
PHP中有关长整数的一些操作教程
2019/09/11 PHP
不一样的文字闪烁 轮番闪烁
2009/11/11 Javascript
深入理解JavaScript系列(6) 强大的原型和原型链
2012/01/15 Javascript
如何实现textarea里的不同文本显示不同颜色
2014/01/20 Javascript
jquery实现无限分级横向导航菜单的方法
2015/03/12 Javascript
全面解析Bootstrap表单使用方法(表单控件)
2015/11/24 Javascript
jquery限定文本框只能输入数字(整数和小数)
2016/01/08 Javascript
深入理解vue中的$set
2017/06/01 Javascript
jQuery表单设置值的方法
2017/06/30 jQuery
jQuery实现简单的计时器功能实例分析
2017/08/29 jQuery
微信小程序获取手机系统信息的方法【附源码下载】
2017/12/07 Javascript
vue.js2.0 实现better-scroll的滚动效果实例详解
2018/08/13 Javascript
JS实现根据详细地址获取经纬度功能示例
2019/04/16 Javascript
Vue的H5页面唤起支付宝支付功能
2019/04/18 Javascript
vue 地区选择器v-distpicker的常用功能
2019/07/23 Javascript
Vue实现将数据库中带html标签的内容输出(原始HTML(Raw HTML))
2019/10/28 Javascript
ant-design表单处理和常用方法及自定义验证操作
2020/10/27 Javascript
python中子类继承父类的__init__方法实例
2016/12/15 Python
Python常用爬虫代码总结方便查询
2019/02/25 Python
pycharm全局搜索的具体步骤
2020/07/28 Python
Html5新特性用canvas标签画多条直线附效果截图
2014/06/30 HTML / CSS
高中的职业生涯规划书
2013/12/28 职场文书
优秀毕业生自我鉴定
2014/01/19 职场文书
跟单业务员岗位职责
2014/03/08 职场文书
公司授权委托书范本
2014/04/03 职场文书
起诉意见书范文
2015/05/19 职场文书
环境卫生整治简报
2015/07/20 职场文书
PyTorch 如何自动计算梯度
2021/05/23 Python
pytorch 如何使用float64训练
2021/05/24 Python
canvas 中如何实现物体的框选
2022/08/05 Javascript