jQuery基础之事件处理方法,如下图:

代码实现:

  <script src="JS/jquery-1.12.4.min.js"></script>
<script>
// 事件代理的第一种方式
// 事件冒泡,子标签的事件会传递给父标签
// 当点击子标签时会将单击事件传递给父标签,导致父标签也执行单击事件
$(function(){
var $div1 = $('#div1');
$div1.click(function(){
alert('父标签' + $div1.html())
});
var $div2 = $('#div2');
$div2.click(function(){
alert('子标签' + $div2.html())
});
});
// 事件代理的第二种方式
// 使用delegate方法完成事件代理 $(function(){
// 获取父标签对象
$div3 = $('#div3');
$div3.delegate('p','click',function(){
// this这是表示子标签元素对象
$(this).css({
color:'red',
width:'300px',
height:'200px',
background:'yellow'
});
});
});
</script> <body>
<div id="div1">111
<div id="div2">22</div>
</div>
<div>
<div id="div3">
<p>使用delegate方法完成事件代理</p>
</div>
</div>
</body>

jQuery基础之事件处理的更多相关文章

  1. jQuery基础之选择器

    摘自:http://www.cnblogs.com/webmoon/p/3169360.html jQuery基础之选择器 选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Aja ...

  2. jquery基础知识汇总

    jquery基础知识汇总 一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库.源码戳这 jQu ...

  3. jquery基础教程读书总结

    最近静下心来看书才深刻的体会到:看书真的很重要,只有看书才能让你有心思静下心来思考. 重温<jquery基础教程> 一.事件 主要掌握常见的事件以及理解jquery的事件处理机制. 需要注 ...

  4. Jquery基础教程第二版学习记录

    本文仅为个人jquery基础的学习,简单的记录以备忘. 在线手册:http://www.php100.com/manual/jquery/第一章:jquery入门基础jquery知识:jquery能做 ...

  5. 第一章 jQuery基础

    第一章jQuery基础 一.jQuert简介 1.什么是jQuery jQuery是javaScript的程序库之一,它是javaScript对象和实用函数的封装. jQuery是继Prototype ...

  6. 《jQuery基础教程(第四版)》学习笔记

    本书代码参考:Learning jQuery Code Listing Browser 原书: jQuery基础教程 目录: 第2章 选择元素 1. 使用$()函数 2. 选择符 3. DOM遍历方法 ...

  7. jQuery基础【1】

    jQuery 是一个“写的更少,但做的更多”的轻量级 JavaScript 库.jQuery 极大地简化了 JavaScript 编程.jQuery 很容易学习.jQuery 库位于一个 JavaSc ...

  8. Web前端学习笔记之jQuery基础

    0x0 jQuery介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Aja ...

  9. 《jQuery基础》总结

    目前,互联网上最好的jQuery入门教材,是Rebecca Murphey写的<jQuery基础>(jQuery Fundamentals).这本书虽然是入门教材,但也足足有100多页.我 ...

随机推荐

  1. TC297B - 外设头文件解析(以IO为例)

    打开例程,目录树下的Includes中包含了各个片上资源对应的头文件,这些头文件定义了相应外设的寄存器地址(寄存器是内置于各个 IP 外设中,是一种用于配置外设功能的存储器,就是一种内存,并且有相对应 ...

  2. springcloud集成redis

    1.application.properties/application.yml配置: redis: # redis数据库索引(默认为0),我们使用索引为3的数据库,避免和其他数据库冲突 databa ...

  3. Python列表中的字典按照该字典下的键值进行排序

    列表中的字典按照该字典下的键值进行排序 这算是排序中比较复杂的一种情况吧,多重嵌套,按照某种规则进行排序.如下面这个json(注:这里这是该列表中的一个项): [ { "stat" ...

  4. leetcode字节跳动专题(持续更新)

    挑战字符串 无重复字符的最长子串 给定一个字符串,请你找出其中不含有重复字符的 最长子串 的长度. 示例 1: 输入: "abcabcbb" 输出: 3 解释: 因为无重复字符的最 ...

  5. POJ 3281 Dining(网络流-拆点)

    Cows are such finicky eaters. Each cow has a preference for certain foods and drinks, and she will c ...

  6. CSUOJ2031-Barareh on Fire(双向BFS)

    Barareh on Fire Submit Page Description The Barareh village is on fire due to the attack of the virt ...

  7. 洛谷 题解 P3385 【【模板】负环】

    一.声明 在下面的描述中,未说明的情况下,\(N\) 是顶点数,\(M\)是边数. 二.判负环算法盘点 想到判负环,我们会想到很多的判负环算法.例如: 1. Bellman-Ford 判负环 这个算法 ...

  8. 洛谷 题解 P1736 【创意吃鱼法】

    题目大意 给出一个 \(n \times m \ (1 \leq n, \ m \leq 2500)\) 的 \(01\) 矩阵,让你在其中找到一个最大的子矩阵使得该子矩阵除了一条对角线上的数字均为 ...

  9. 洛谷 题解 P5015 【标题统计】 NOIP2018 普及组 T1

    没有人用 scanf("%c", &ch) != EOF 吗? scanf 和 EOF 会伤心的. 思路:逐个读入字符,遇到EOF中止,对于每个读入的字符进行判断. 附上考 ...

  10. WOE(证据权重)为何这样计算?

    更多大数据分析.建模等内容请关注公众号<bigdatamodeling> 先简单回顾一下WOE的含义.假设x是类别变量或分箱处理过的连续变量,含R个类别或分段,取值为{C1, ..., C ...