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多页.我 ...
随机推荐
- xshell使用xftp传输文件、使用pure-ftpd搭建ftp服务
6月25日任务 15.4 xshell使用xftp传输文件15.5 使用pure-ftpd搭建ftp服务扩展vsftp使用mysql存放虚拟用户并验证 http://www.aminglinux.co ...
- 在Windows系统中构建还原ASP.NET Core 源码
大家好,这几天试着从Github上拉取AspNetCore的源码,尝试着通过Visual Studio 打开,但是并不尽人意.我们需要去构建我们拉去的源代码,这样才可以通过VisualStudio可还 ...
- C# MVC 过滤器
APS.NET MVC中(以下简称“MVC”)的每一个请求,都会分配给相应的控制器和对应的行为方法去处理,而在这些处理的前前后后如果想再加一些额外的逻辑处理.这时候就用到了过滤器. MVC支持的过滤器 ...
- php 图片指定留白叠加缩放
遇到这样一个需求:原图大小不一,而且留白也大小不一,需要将原图切出来一个核心图,然后将图片左右留白,组成一个其他尺寸的图片.换句话说,原图在新图片中的位置是可以控制的. 这里思路是:先创建一个规定大小 ...
- 带着canvas去流浪系列之五 绘制K线图
[摘要] 用canvas原生API实现百度Echarts 示例代码托管在:http://www.github.com/dashnowords/blogs 一. 任务说明 使用原生canvasAPI绘制 ...
- HDU 6118 度度熊的交易计划(网络流-最小费用最大流)
度度熊参与了喵哈哈村的商业大会,但是这次商业大会遇到了一个难题: 喵哈哈村以及周围的村庄可以看做是一共由n个片区,m条公路组成的地区. 由于生产能力的区别,第i个片区能够花费a[i]元生产1个商品,但 ...
- R语言主成分分析（PCA）
数据的导入 > data=read.csv('F:/R语言工作空间/pca/data.csv') #数据的导入> > ls(data) #ls()函数列出所有变量 [1] " ...
- 当用python读取几十万行文本时，会出现什么状况？
前言本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:accumulate_zhang 我在使用python读取几十 ...
- 【React】在React中 JSX 代码如何转成 JS 代码？
一.介绍 写 React 代码的朋友应该都是直接写 JSX 代码,JSX 让我们可以在 JS 中直接写 HTML 代码,可阅读性较高.本章节主要介绍 JSX 通过 babel 转换后会生成什么样式代码 ...
- web性能优化指南
前端性能优化,是每个前端必备的技能,优化自己的代码,使自己的网址可以更加快速的访问打开,减少用户等待,今天就会从几个方面说起前端性能优化的方案, 看下面的一张图,经常会被面试官问,从输入URL到页面加 ...