JQuery事件与应用(一)
来源:http://www.imooc.com/learn/11 jQuery基础课程
一、使用bind()方法绑定元素的事件
功能:
在ready()
事件中绑定一个按钮的单击事件,使用bind()
方法绑定单击(click)
和鼠标移出(mouseout)
这两个事件,触发这两个事件中,按钮将变为不可用。
<script type="text/javascript">
$(function () {
$("#btntest").bind("click mouseout", function () {
$(this).attr("disabled", "true");
})
});
</script>
结果:
二、使用hover()方法切换事件
说明:使用hover()
方法执行两个函数,当鼠标移在元素上时调用addClass()
方法增加一个样式,移出时,调用removeClass()
方法移除该样式。
<script type="text/javascript">
$(function () {
$("div").hover(
function () {
$(this).addClass("orange");
},
function () {
$(this).removeClass("orange")
})
});
</script>
三、使用toggle()方法绑定多个函数
<script type="text/javascript">
$(function () {
$("#btntest").bind("click", function () {
$("div").toggle()
})
});
</script>
JQuery事件与应用(一)的更多相关文章
- JQuery选择器JQuery 事件
JQuery 元素选择器 jQuery 使用 CSS 选择器来选取 HTML 元素. $("p") 选取 <p> 元素. $("p.intro") ...
- HTML Select 标签选择后触发jQuery事件代码实例
页面设计原由: 因为很多客户不知道如何来到我们公司,领导想让我在微信公众号上面做一个链接,客户可以直接通过微信公众号打开地图并导航到我们公司的办公地点. 实现起来并不难,但由于公司有很多办事处,所以需 ...
- jquery事件核心源码分析
我们从绑定事件开始,一步步往下看: 以jquery.1.8.3为例,平时通过jquery绑定事件最常用的是on方法,大概分为下面3种类型: $(target).on('click',function( ...
- 解密jQuery事件核心 - 委托设计(二)
第一篇 http://www.cnblogs.com/aaronjs/p/3444874.html 从上章就能得出几个信息: 事件信息都存储在数据缓存中 对于没有特殊事件特有监听方法和普通事件都用ad ...
- 解密jQuery事件核心 - 模拟事件(四)
前几章已经把最核心的实现都分解过了,这一章我们看看jQuery是如何实现事件模拟的 在Internet Explorer 8和更低,一些事件change 和 submit本身不冒泡,但jQuery修改 ...
- 深入学习jQuery事件对象
× 目录 [1]获取 [2]事件类型 [3]事件目标[4]当前元素[5]事件冒泡[6]默认行为[7]命名空间[8]返回值[9]键值 前面的话 在触发DOM上的某个事件时,会产生一个事件对象event, ...
- 深入学习jQuery事件绑定
× 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...
- jquery 事件冒泡的介绍以及如何阻止事件冒泡
在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级 ...
- jQuery源代码学习之九—jQuery事件模块
jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...
- jQuery事件总结
blur() 触发或绑定blur事件.$("input").blur(function(){ $("input").css("background-c ...
随机推荐
- HTML第八天笔记
第一个知识点是关于伪类的,代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...
- C++的优秀特性4:指针
(转载请注明原创于潘多拉盒子) 其实指针不是C++的特性,而是地地道道的C的特性.有人说C++继承了C的指针,实在是败笔,造成内存泄漏云云,纯粹是不懂.可以这么说,如果没有指针,C++会逊色很多,应用 ...
- FTP远程命令集
使用ftp命令进行远程文件传输 ftp命令是标准的文件传输协议的用户接口.ftp是在TCP/IP网络上的计算机之间传输文件的简单有效的方法.它允许用户传输ASCII文件和二进制文件. 在ftp会话过程 ...
- Codeforces Round #180 (Div. 2) D. Fish Weight 贪心
D. Fish Weight 题目连接: http://www.codeforces.com/contest/298/problem/D Description It is known that th ...
- .NET程序性能的基本要领
前几天在老赵的博客上看到,Bill Chiles (Roslyn 编译器的Program Manager)写了一篇文章叫做<Essential Performance Facts and .NE ...
- 开源图形库 c语言-图形图像库 集合[转]
开源图形库 c语言-图形图像库 集合[转] Google三维API O3D O3D 是一个开源的 Web API 用来在浏览器上创建界面丰富的交互式的 3D 应用程序.这是一种基于网页的可控3D标准. ...
- 剑指 offer set 3 旋转数组的最小数字
总结 1. 没有重复元素的旋转数组可用 logn 时间内求出结果. 解法有两个步骤, 先是求出发生旋转的点(以 array[0] 为支点求得), 然后用正常的二分查找给出结果 2. 有重复元素元素的旋 ...
- fs/ext2/inode.c相关函数注释
用数组chain[4]描述四种不同的索引,即直接索引.一级间接索引.二级间接索引.三级间接索引.举例说明这个结构各个域的含义.如果文件内的块号为8,则不需要间接索引,所以只用chain[0]一个Ind ...
- char *a 与char a[] 的区别
原文:http://www.cnblogs.com/kaituorensheng/archive/2012/10/23/2736069.html char *a = "hello" ...
- Java元组Tuple使用实例--转载
原文地址:http://50vip.com/35.html 一.为什么使用元组tuple? 元组和列表list一样,都可能用于数据存储,包含多个数据:但是和列表不同的是:列表只能存储相同的数据类型,而 ...