实例解析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 相关文章推荐
JS 参数传递的实际应用代码分析
Sep 13 Javascript
jQuery使用$.ajax提交表单完整实例
Dec 11 Javascript
深入浅析JavaScript面向对象和原型函数
Feb 06 Javascript
bootstrap与Jquery UI 按钮样式冲突的解决办法
Sep 23 Javascript
JavaScript中捕获/阻止捕获、冒泡/阻止冒泡方法
Dec 07 Javascript
微信小程序 自定义消息提示框
Aug 06 Javascript
JS实现图片手风琴效果
Apr 17 Javascript
你应该知道的几类npm依赖包管理详解
Oct 06 Javascript
vue-router项目实战总结篇
Feb 11 Javascript
Vue-router 中hash模式和history模式的区别
Jul 24 Javascript
详解Element 指令clickoutside源码分析
Feb 15 Javascript
在vue中使用vant TreeSelect分类选择组件操作
Nov 02 Javascript
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
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
一个用php3编写的简单计数器
2006/10/09 PHP
Yii分页用法实例详解
2014/12/04 PHP
详解WordPress开发中过滤属性以及Sql语句的函数使用
2015/12/25 PHP
php和redis实现秒杀活动的流程
2019/07/17 PHP
MSN消息提示类
2006/09/05 Javascript
图片轮换效果实现代码(点击按钮停止执行)
2013/04/12 Javascript
php 中序列化和json使用介绍
2013/07/08 Javascript
网站基于flash实现的Banner图切换效果代码
2014/10/14 Javascript
jQuery中prepend()方法用法实例
2014/12/25 Javascript
javascript函数式编程程序员的工具集
2015/10/11 Javascript
Ionic如何实现下拉刷新与上拉加载功能
2016/06/03 Javascript
轻松掌握JavaScript单例模式
2016/08/25 Javascript
getElementById().innerHTML与getElementById().value的区别
2016/10/27 Javascript
浅谈React 属性和状态的一些总结
2016/11/21 Javascript
js遍历json对象所有key及根据动态key获取值的方法(必看)
2017/03/09 Javascript
jquery实现提示语淡入效果
2017/05/05 jQuery
JS实现点击Radio动态更新table数据
2017/07/18 Javascript
vue-router路由与页面间导航实例解析
2017/11/07 Javascript
JavaScript设计模式之单例模式原理与用法实例分析
2018/07/26 Javascript
Echart折线图手柄触发事件示例详解
2018/12/16 Javascript
node.js使用mongoose操作数据库实现购物车的增、删、改、查功能示例
2019/12/23 Javascript
JS async 函数的含义和用法实例总结
2020/04/08 Javascript
[02:51]DOTA2 Supermajor小组分组对阵抽签仪式
2018/06/01 DOTA
[01:01:52]DOTA2-DPC中国联赛正赛 iG vs LBZS BO3 第一场 3月4日
2021/03/11 DOTA
在Django的模板中使用认证数据的方法
2015/07/23 Python
深入浅析Python 命令行模块 Click
2020/03/11 Python
python 还原梯度下降算法实现一维线性回归
2020/10/22 Python
Python的logging模块基本用法
2020/12/24 Python
通过css3的filter滤镜改变png图片的颜色的示例代码
2020/05/06 HTML / CSS
日本最大的药妆连锁店:Matsukiyo松本清药妆店
2017/11/23 全球购物
weblogic面试题
2016/03/07 面试题
一些关于MySql加速和优化的面试题
2014/01/30 面试题
岗位职责的定义
2013/11/10 职场文书
yy结婚证婚词
2014/01/10 职场文书
Java异常处理try catch的基本用法
2021/12/06 Java/Android
vue使用element-ui按需引入
2022/05/20 Vue.js