实例解析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 相关文章推荐
仿微博字符限制效果实现代码
Apr 20 Javascript
javaScript 删除字符串空格多种方法小结
Oct 24 Javascript
js实现按一下删除键删除整个单词附demo
Sep 05 Javascript
基于JS实现的倒计时程序实例
Jul 24 Javascript
使用jQuery的toggle()方法对HTML标签进行显示、隐藏的方法(示例)
Sep 01 Javascript
Vue.js实现拖放效果的实例
Sep 30 Javascript
flag和jq on 的绑定多个对象和方法(必看)
Feb 27 Javascript
基于vue2.0动态组件及render详解
Mar 17 Javascript
Javascript实现时间倒计时功能
Nov 17 Javascript
vuejs2.0运用原生js实现简单拖拽元素功能
Aug 21 Javascript
微信小程序时间控件picker view使用详解
Dec 28 Javascript
JS判断两个数组或对象是否相同的方法示例
Feb 28 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
老照片 - 几十年前的收音机与人
2021/03/02 无线电
慎用preg_replace危险的/e修饰符(一句话后门常用)
2013/06/19 PHP
php使用百度翻译api示例分享
2014/01/31 PHP
php和C#的yield迭代器实现方法对比分析
2019/07/17 PHP
页面只有一个text的时候,回车自动submit的解决方法
2010/08/12 Javascript
JQuery实现表格中相同单元格合并示例代码
2013/06/26 Javascript
提取字符串中年月日的函数代码
2013/11/05 Javascript
js时间比较示例分享(日期比较)
2014/03/05 Javascript
Javascript基础教程之比较操作符
2015/01/18 Javascript
JavaScript中数据结构与算法(三):链表
2015/06/19 Javascript
IE8下jQuery改变png图片透明度时出现的黑边
2015/08/30 Javascript
jQuery限制图片大小的方法
2016/05/25 Javascript
JS实现输入框提示文字点击时消失效果
2016/07/19 Javascript
基于jQuery实现多标签页切换的效果(web前端开发)
2016/07/24 Javascript
详解jQuery插件开发方式
2016/11/22 Javascript
Three.js获取鼠标点击的三维坐标示例代码
2017/03/24 Javascript
JS简单判断字符在另一个字符串中出现次数的2种常用方法
2017/04/20 Javascript
[js高手之路]图解javascript的原型(prototype)对象,原型链实例
2017/08/28 Javascript
node.js中http模块和url模块的简单介绍
2017/10/06 Javascript
Vue.js 动态为img的src赋值方法
2018/03/14 Javascript
实例分析JS中的相等性判断===、 ==和Object.is()
2019/11/17 Javascript
vue组件中传值EventBus的使用及注意事项说明
2020/11/16 Javascript
windows如何把已安装的nodejs高版本降级为低版本(图文教程)
2020/12/14 NodeJs
[05:02][DOTA2]DOTA进化论 第一期
2013/09/27 DOTA
Python基础篇之初识Python必看攻略
2016/06/23 Python
在dataframe两列日期相减并且得到具体的月数实例
2018/07/03 Python
树莓派4B+opencv4+python 打开摄像头的实现方法
2019/10/18 Python
Python input函数使用实例解析
2019/11/22 Python
Python爬取数据并实现可视化代码解析
2020/08/12 Python
5个你不知道的HTML5的接口介绍
2013/08/07 HTML / CSS
2014年党的群众路线教育实践活动总结
2014/04/25 职场文书
旅行社优秀创业计划书
2014/08/16 职场文书
2014年企业工会工作总结
2014/11/12 职场文书
终止解除劳动合同证明书
2015/06/17 职场文书
linux下导入、导出mysql数据库命令的实现方法
2021/05/26 MySQL
MySql开发之自动同步表结构
2021/05/28 MySQL