实例解析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 常用方法总结
Jun 03 Javascript
Javascript 圆角div的实现代码
Oct 15 Javascript
基于jQuery的合并表格中相同文本的相邻单元格的代码
Apr 06 Javascript
js 与 php 通过json数据进行通讯示例
Mar 26 Javascript
Bootstrap每天必学之前端开发框架
Nov 19 Javascript
node.js学习之base64编码解码
Oct 21 Javascript
Vue声明式渲染详解
May 17 Javascript
vue.js计算属性computed用法实例分析
Jul 06 Javascript
vue-router中scrollBehavior的巧妙用法
Jul 09 Javascript
利用vue.js把静态json绑定bootstrap的table方法
Aug 28 Javascript
Koa 使用小技巧(小结)
Oct 22 Javascript
如何从零开始手写Koa2框架
Mar 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
PHP中iconv函数转码时截断字符问题的解决方法
2015/01/21 PHP
PHP实现上传文件并存进数据库的方法
2015/07/16 PHP
ThinkPHP安装和设置
2015/07/27 PHP
php倒计时出现-0情况的解决方法
2016/07/28 PHP
针对PHP开发安全问题的相关总结
2019/03/22 PHP
JSONP 跨域共享信息
2012/08/16 Javascript
jquery遍历数组与筛选数组的方法
2013/11/05 Javascript
推荐10 款 SVG 动画的 JavaScript 库
2015/03/24 Javascript
bootstrap监听滚动实现头部跟随滚动
2016/11/08 Javascript
关于js中的鼠标事件总结
2017/07/11 Javascript
Vue基于NUXT的SSR详解
2017/10/24 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
2017/12/19 Javascript
详解ES6中的代理模式——Proxy
2018/01/08 Javascript
vue select选择框数据变化监听方法
2018/08/24 Javascript
原生js检测页面加载完毕的实例
2018/09/11 Javascript
angular中子控制器向父控制器传值的实例
2018/10/08 Javascript
策略模式实现 Vue 动态表单验证的方法
2019/09/16 Javascript
Vue移动端实现图片上传及超过1M压缩上传
2019/12/23 Javascript
Antd-vue Table组件添加Click事件,实现点击某行数据教程
2020/11/17 Javascript
python标准日志模块logging的使用方法
2013/11/01 Python
在Python中利用Into包整洁地进行数据迁移的教程
2015/03/30 Python
Python多进程并发(multiprocessing)用法实例详解
2015/06/02 Python
django使用图片延时加载引起后台404错误
2017/04/18 Python
浅谈python正则的常用方法 覆盖范围70%以上
2018/03/14 Python
python自动发送测试报告邮件功能的实现
2019/01/22 Python
pandas DataFrame 行列索引及值的获取的方法
2019/07/02 Python
利用Pandas和Numpy按时间戳将数据以Groupby方式分组
2019/07/22 Python
python getopt模块使用实例解析
2019/12/18 Python
data:image data url 文件转为Blob上传后端的方法
2019/07/16 HTML / CSS
思想政治自我鉴定
2013/10/06 职场文书
留学自荐信的技巧
2013/10/17 职场文书
高三历史教学反思
2014/01/09 职场文书
小班幼儿评语大全
2014/04/30 职场文书
党员服务承诺书
2014/05/28 职场文书
2014年仓库工作总结
2014/11/20 职场文书
实习单位推荐信
2015/03/27 职场文书