jQuery基础之事件处理
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基础之事件处理的更多相关文章
- jQuery基础之选择器
摘自:http://www.cnblogs.com/webmoon/p/3169360.html jQuery基础之选择器 选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Aja ...
- jquery基础知识汇总
jquery基础知识汇总 一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库.源码戳这 jQu ...
- jquery基础教程读书总结
最近静下心来看书才深刻的体会到:看书真的很重要,只有看书才能让你有心思静下心来思考. 重温<jquery基础教程> 一.事件 主要掌握常见的事件以及理解jquery的事件处理机制. 需要注 ...
- Jquery基础教程第二版学习记录
本文仅为个人jquery基础的学习,简单的记录以备忘. 在线手册:http://www.php100.com/manual/jquery/第一章:jquery入门基础jquery知识:jquery能做 ...
- 第一章 jQuery基础
第一章jQuery基础 一.jQuert简介 1.什么是jQuery jQuery是javaScript的程序库之一,它是javaScript对象和实用函数的封装. jQuery是继Prototype ...
- 《jQuery基础教程(第四版)》学习笔记
本书代码参考:Learning jQuery Code Listing Browser 原书: jQuery基础教程 目录: 第2章 选择元素 1. 使用$()函数 2. 选择符 3. DOM遍历方法 ...
- jQuery基础【1】
jQuery 是一个“写的更少,但做的更多”的轻量级 JavaScript 库.jQuery 极大地简化了 JavaScript 编程.jQuery 很容易学习.jQuery 库位于一个 JavaSc ...
- Web前端学习笔记之jQuery基础
0x0 jQuery介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Aja ...
- 《jQuery基础》总结
目前,互联网上最好的jQuery入门教材,是Rebecca Murphey写的<jQuery基础>(jQuery Fundamentals).这本书虽然是入门教材,但也足足有100多页.我 ...
随机推荐
- rsync工具、rsync常用选项、以及rsync通过ssh同步 使用介绍
第8周5月14日任务 课程内容: 10.28 rsync工具介绍10.29/10.30 rsync常用选项10.31 rsync通过ssh同步 10.28 rsync工具介绍 rsync是一个同步的工 ...
- c++ use curllib send REST API request to Web server
E.g and explaination: Pre-condition: Server is running and can reciever CURL command with json forma ...
- C语言博客作业10
一.本周教学内容&目标 第4章 循环结构 4.5 综合介绍循环结构的程序设计,涉及到多个典型算法.要求学生能够根据实际情况,选择合适的算法.合理的循环结构,熟练的编写程序. 二.本周作业头 这 ...
- 关于jsp中jstl报错Can not find the tag library descriptor for "http://java.sun.com/jsp/jstl/core
有的时候在开发jsp时,需要使用jstl时,在jsp上面引用jstl却出现错误:Can not find the tag library descriptor for "http://jav ...
- 如何在VMware下通过挂载系统光盘搭建本地yum软件仓库
1.打开自己VMware软件中的虚拟机 2.输入用户名root密码登陆进去 3.打开 应用程序----收藏-----终端 4.首先回到根目录,输入cd ..(中间有空格) 5.创建一个名称为swlaa ...
- 漫谈LiteOS之开发板-GPIO（基于GD32450i-EVAL）
[摘要] 本文主要从GPIO的定义.工作模式.特色.工作场合.以及GD32450i-EVAL开发板的引脚.对应的寄存器以及GPIO的流水灯示例对GPIO加以介绍,希望对你有所帮助. 1定义 GPIO( ...
- 转:FileSync plugin for Eclipse 安装注意事项 Eclipse文件同步插件
习惯了使用MyEclipse,各种插件不用自己安装,觉得开发起来很方便,现在大家都用Eclipse了,还有不用Eclipse用更高级的,IT当然开发大型项目没人用UltraEdit吧,虽然是一个不错的 ...
- iOS面试的算法相关
转自:https://www.jianshu.com/p/c4820b159159 面试中遇到的这些算法,在平常工作中,基本不会用到. 不过现实的面试中经常喜欢问关于算法的问题 有些还要求写出代码.一 ...
- NSURLSession使用(整理版)
NSURLSession使用 1.NSURLSession诞生于2013年,但其在前几年一直生活在NSURLConnection的阴影下,直到iOS9的出现,NSURLConnection被官方宣布弃 ...
- jQuery中的基本的选择器学习(补充版)
先看整体代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...