1. <a> a标签默认绑定了一个onclick事件，当自己再写一个onclick事件的时候，默认自己写的那个优先执行。

如下程序，先执行（123），然后再发生跳转。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <a onclick='ClickOn()' href="http://www.oldboyedu.com">走你</a>

    <script>

        function ClickOn(){

            alert(123);

        }

    </script>

</body>

</html>

2.如果只想让它执行第一步onclick的时候，可以return 一个false回来。

先在此处 onclick='return ClickOn()' 加上return， 再加上return false。。如下黄色标识的2处都需要加上return。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <a onclick='return ClickOn()' href="http://www.oldboyedu.com">走你</a>

    <script>

        function ClickOn(){

            alert(123);

            return false;

        }

    </script>

</body>

</html>

效果，只会弹出123，但不会发生跳转。

如果是return true的话，则2个都会执行。

3. jquery的绑定方式如下：默认先弹出456，再发生跳转。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <a onclick='return ClickOn()' href="http://www.oldboyedu.com">走你1</a>

    <a id='i1' href="http://www.oldboyedu.com">走你2</a>

    <script src="jquery-1.12.4.js"></script>

    <script>

        function ClickOn(){

            alert(123);

            return false;

        }

        $('#i1').click(function(){

            alert(456);

        })

    </script>

</body>

</html>

用jQuery阻止后续事件的发生，加上只需要加上return false就可以了。在onclick处不需要加上return。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <a onclick='return ClickOn()' href="http://www.oldboyedu.com">走你1</a>

    <a id='i1' href="http://www.oldboyedu.com">走你2</a>

    <script src="jquery-1.12.4.js"></script>

    <script>

        function ClickOn(){

            alert(123);

            return false;

        }

        $('#i1').click(function(){

            alert(456);

            return false; //用jQuery阻止后续事件发生的时候，仅此一处加上return就可以了。

        })

    </script>

</body>

</html>

jQuery多重事件绑定的更多相关文章

  1. [HTML5]原生事件绑定和jquery动态事件绑定的区别

    原生事件绑定: <!-- 标签上绑定的事件是由window对象帮助调用,因此方法内的this其实是window对象 --> <label><input type=&quo ...

  2. jquery 动态事件绑定(0512)

    jquery动态事件绑定,父元素需为静态元素,(不能是动态生成): $("#parent").on("click","#child",fun ...

  3. python 全栈开发，Day55(jQuery的位置信息,JS的事件流的概念(重点),事件对象,jQuery的事件绑定和解绑,事件委托(事件代理))

    一.jQuery的位置信息 jQuery的位置信息跟JS的client系列.offset系列.scroll系列封装好的一些简便api. 一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集 ...

  4. 对jQuery的事件绑定的一些思考

    jQuery的事件绑定 问题 首先我们看下面的一个非经常见的事件绑定代码: //example $('#dom').click(function(e){ //do something }); $('# ...

  5. jQuery的事件绑定与触发 - 学习笔记

    jQuery的事件绑定与触发 事件绑定 自动触发事件 常用的鼠标事件 事件冒泡和默认行为 事件冒泡 默认行为 获得当前鼠标的位置和按键 jQuery的事件绑定与触发 事件绑定 基本绑定 $(eleme ...

  6. 7 HTML&JS等前端知识系列之jquery的事件绑定

    preface 我们知道,每一个a,input等等标签都可以为其绑定一个事件,onclick也好,focus 也罢,都可以绑定的.但是众神key想过这个问题没有,倘若这里有1000个input标签需要 ...

  7. jQuery中事件绑定到bind、live、delegate、on方法的探究

    1. 给页面上的某个元素绑定事件,最初采用下面的方式实现: $(‘selector’).click(function(){ //code }); 缺点: 不能同时绑定多个事件,不能绑定动态的元素. 后 ...

  8. jQuery的事件绑定命名空间

    jQuery的bind的函数在实际应用中用的不是特别多,只是他可以绑定一个事件,但不会即时触发,也可以通过unbind来解除绑定.在没有看到这篇文章之前,我一直不知道原来bind也可以有命名空间.事实 ...

  9. 前端 -----jQuery的事件绑定和解绑

    11-jQuery的事件绑定和解绑   1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (S ...

随机推荐

  1. The specified value "2019-1-2" does not conform to the required format, "yyyy-MM-dd"

    问题: 在cshtml中转换的日期格式错误,前端报错:The specified value "2019-1-2" does not conform to the required ...

  2. python环境通过selenium实现自动化web登陆及终端邀请

    自动化主要的就是识别对象,可以在网上搜到各种各样的方法,自行百度.下面仅附上一个简单的例子. 环境搭建参考如下链接: https://www.cnblogs.com/hepeilinnow/p/101 ...

  3. Python 3 利用 Dlib 实现摄像头人脸检测特征点标定

    0. 引言 利用 Python 开发,借助 Dlib 库捕获摄像头中的人脸,进行实时人脸 68 个特征点标定: 支持多张人脸: 有截图功能: 图 1 工程效果示例( gif ) 图 2 工程效果示例( ...

  4. thinkphp5框架生成二维码(二)

    上篇已经讲过了SDK之类的,这个不再重复,有不知道的童鞋们,请去看上篇文章吧. 这里我用的方法比较老旧,大家有更好的方法,可以进行改良,还有linux服务器,记得给文件权限,否则生成的文件会失败的.大 ...

  5. 技本功丨请带上纸笔刷着看：解读MySQL执行计划的type列和extra列

    本萌最近被一则新闻深受鼓舞,西工大硬核“女学神”白雨桐,获6所世界顶级大学博士录取 货真价值的才貌双全,别人家的孩子 高考失利与心仪的专业失之交臂,选择了软件工程这门自己完全不懂的专业.即便全部归零, ...

  6. 剑指 Offer——和为 S 的两个数字

    1. 题目 2. 解答 由于数组是已经排好序的,我们可以定义两个指针,第一个指针指向第一个元素,第二个指针指向最后一个元素,然后求出这两个元素的和,与目标和进行比较.若小于目标和,第一个指针向前移动: ...

  7. Hibernate入门篇<1>hibernate.cfg.xml学习小结

    Hibernate配置文件主要用于配置数据库连接和Hibernate运行时所需的各种属性,这个配置文件应该位于应用程序或Web程序的类文件夹 classes中.Hibernate配置文件支持两种形式, ...

  8. 用 Python 3 的 async / await 做异步编程

    前年我曾写过一篇<初探 Python 3 的异步 IO 编程>,当时只是初步接触了一下 yield from 语法和 asyncio 标准库.前些日子我在 V2EX 看到一篇<为什么 ...

  9. Java 学习笔记 ------第五章 对象封装

    本章学习目标: 了解封装的概念与实现 定义类.构造函数与方法 使用方法重载与不定长度自变量 了解static方法 一.Java封装概念 在面向对象程式设计方法中,封装(英语:Encapsulation ...

  10. Dijkstra 最短路径算法 秒懂详解

    想必大家一定会Floyd了吧,Floyd只要暴力的三个for就可以出来,代码好背,也好理解,但缺点就是时间复杂度高是O(n³). 于是今天就给大家带来一种时间复杂度是O(n²),的算法:Dijkstr ...