实例解析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 相关文章推荐
超级酷和最实用的jQuery实例收集(20个)
Apr 21 Javascript
改进UCHOME的记录发布,增强可访问性用户体验
Jan 17 Javascript
JavaScript严格模式详解
Nov 18 Javascript
Angular2 组件交互实例详解
Aug 24 Javascript
Bootstrap一款超好用的前端框架
Sep 25 Javascript
vue加载完成后的回调函数方法
Sep 07 Javascript
Vue.js 父子组件通信的十种方式
Oct 30 Javascript
微信小程序新手教程之启动页的重要性
Mar 03 Javascript
Vuex mutitons和actions初使用详解
Mar 04 Javascript
详细教你微信公众号正文页SVG交互开发技巧
Jul 25 Javascript
基于js实现数组相邻元素上移下移
May 19 Javascript
k8s node节点重新加入master集群的实现
Feb 22 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
Windows 下的 PHP-PEAR 安装方法
2010/11/20 PHP
php基本函数汇总
2015/07/09 PHP
PHP array_reverse() 函数原理及实例解析
2020/07/14 PHP
Javascript中的数学函数集合
2007/05/08 Javascript
jquery动画2.元素坐标动画效果(创建一个图片走廊)
2012/08/24 Javascript
jQuery中:input选择器用法实例
2015/01/03 Javascript
AngularJS 与百度地图的结合实例
2016/10/20 Javascript
基于Bootstrap表单验证功能
2017/11/17 Javascript
使用classList来实现两个按钮样式的切换方法
2018/01/24 Javascript
基于node搭建服务器,写接口,调接口,跨域的实例
2018/05/13 Javascript
React注册倒计时功能的实现
2018/09/06 Javascript
vue实现添加与删除图书功能
2018/10/07 Javascript
JavaScript RegExp 对象用法详解
2019/09/24 Javascript
vue和iview实现Scroll 数据无限滚动功能
2019/10/31 Javascript
原生JS实现微信通讯录
2020/06/18 Javascript
在Python程序中操作文件之isatty()方法的使用教程
2015/05/24 Python
剖析Python的Tornado框架中session支持的实现代码
2015/08/21 Python
详解Python之数据序列化(json、pickle、shelve)
2017/03/30 Python
Python模块搜索路径代码详解
2018/01/29 Python
详解django三种文件下载方式
2018/04/06 Python
python中datetime模块中strftime/strptime函数的使用
2018/07/03 Python
对python 通过ssh访问数据库的实例详解
2019/02/19 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
python实现猜拳游戏
2020/03/04 Python
python切割图片的示例
2020/11/12 Python
html5 canvas移动浏览器上实现图片压缩上传
2016/03/11 HTML / CSS
美国标志性加大尺码时装品牌:Ashley Stewart
2016/12/15 全球购物
ASP.NET中的身份验证有那些
2012/07/13 面试题
教育专业自荐书范文
2013/12/17 职场文书
学生安全责任书
2014/04/15 职场文书
班级文化标语
2014/06/23 职场文书
小学生2014国庆节演讲稿:祖国在我心中
2014/09/21 职场文书
联欢会开场白
2015/06/01 职场文书
党支部意见范文
2015/06/02 职场文书
Centos7中MySQL数据库使用mysqldump进行每日自动备份的编写
2021/08/02 MySQL
Java 关于String字符串原理上的问题
2022/04/07 Java/Android