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 ...
随机推荐
- easyui combobox筛选(拼音)
1.combobox本身的筛选 $('#cc').combobox({ filter: function(q, row){ var opts = $(this).combobox('options') ...
- nodejs以及npm的安装
参考资料:http://xiaoyaojones.blog.163.com/blog/static/28370125201351501113581/ 上面的仁兄说的比较清楚,基本解决了安装中遇到的问题 ...
- jQuery生成全页面的悬浮覆盖层效果(overlay)
可能在大家开发的过程中,往往需要自己生成一个全页面的覆盖层,以便让用户能够把注意力专注于开发者指定的某一个区域,在这里开发小技巧里,我们使用非常简单的代码生成类似的效果,如下: $("#ov ...
- CDOJ 第七届ACM趣味程序设计竞赛第三场(正式赛) 题解
宝贵资源 题目连接: http://acm.uestc.edu.cn/#/problem/show/1265 题意 平面上给n个点(n<=1000),要求找一个面积最小的正方形,将所有的点都囊括 ...
- 如何用C#语言构造蜘蛛程序
"蜘蛛"(Spider)是Internet上一种很有用的程序,搜索引擎利用蜘蛛程序将Web页面收集到数据库,企业利用蜘蛛程序监视竞争对手的网站并跟踪变动,个人用户用蜘蛛程序下载We ...
- UVA 253 (13.08.06)
Cube painting We have a machine for painting cubes. It is supplied withthree different colors: blu ...
- HTML5 自动聚焦 属性
原文 : HTML5 autofocus Attribut 原文发布时间: 2012年08月27日 翻译时间: 2013年8月6日 HTML5 推出了一大堆精彩的东西给我们. 过去我们要用JavaSc ...
- kickstart一键自动安装Linux系统
kickstart,无人值守,自动安装系统.本文介绍kickstart的用法. #安装系统的信息——可以参考 [root@larrywen pdf]# vim ~/anaconda-ks.cfg 第一 ...
- 【C语言】模拟实现库函数strcat函数
//模拟实现库函数strcat函数 #include <stdio.h> #include <string.h> #include <assert.h> char ...
- Java和C++中多态的实现方式
多态是面向对象的最主要的特性之一,是一种方法的动态绑定,实现运行时的类型决定对象的行为.多态的表现形式是父类指针或引用指向子类对象,在这个指针上调用的方法使用子类的实现版本.多态是IOC.模板模式实现 ...