jQuery事件之绑定事件
语法:
$(selector).bind(eventType[, eventData], handler(eventObject));
参数解释:
<li>eventType(String): 一个包含一个或多个DOM事件类型的字符串, 比如"click"或"submit"或自定义事件的名称。</li>
<li>eventData(Ojbect): 可选,它包含的数据键值对映射将被传递给时间处理程序</li>
<li>handler(function): 每当时间触发时执行的函数</li>
作用:为每一个匹配元素的特定时间(如click)绑定一个时间处理器函数。
示例代码:
.bind()的一个基本用法,绑定一个或者多个DOM事件
当每个p标签被点击的时候,显示其文本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>bind Demo</title>
<style type="text/css">
p{
background-color: yellow;
font-weight: bold;
cursor: pointer;
padding: 5px;
}
p.over{
background-color: #ccc;
}
span{
color: red;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){
$("p").bind("click", function(event){
$("span").text("Click happened!");
});
$("p").bind("dblclick", function(){
$("span").text("Double-click happened!");
});
$("p").bind("mouseenter mouseleave", function(event){
$(this).toggleClass("over");
});
})
</script>
</head>
<body>
<p>Click or double clice here.</p>
<span></span>
</body>
</html>
还可以在event处理之前传递一些附加的数据
function handler(event){
// event.data可以划去bind()方法的第二个参数的数据
alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler())
通过返回false来取消默认的行为, 并阻止事件起泡
$("form").bind('submit', function() {return false; });
或者通过preventDefault()方法只取消默认的行为
$("form").bind("submit", function(event){
event.preventDefault();
})
jQuery事件之绑定事件的更多相关文章
- 关于Jquery的delegate绑定事件无效
今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...
- jQuery学习-事件之绑定事件(三)
在上一篇<jQuery学习-事件之绑定事件(二)>我们了解了jQuery的dispatch方法,今天我们来学习下handlers 方法: handlers: function( event ...
- jQuery学习-事件之绑定事件(二)
在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) { ...
- JQuery Mobile - 为什么绑定事件后会被多次执行?
JQuery Mobile 在绑定事件时候,发现会被多次执行,为什么啊? 原来,jquery click 不是替换原有的function ,而是接着添加,所以才会执行次数越来越多,怎么办才能按需实现 ...
- jquery-10 jquery中的绑定事件和解绑事件的方法是什么
jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...
- 2017年3月25日工作日志:Jquery使用小结[绑定事件判断、select标签、军官证正则]
jQuery获取DOM绑定事件 在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data( ...
- jQuery添加html绑定事件
jQuery添加html绑定事件 $("#xxx").on("click",".dev",function(){ });
- jquery中on绑定事件
之前项目中动态创建的标签元素 在绑定事件的时候 都是无效 无论如何都不能触发 eg:在页面加载完成之后 再由脚本动态创建的<div>元素 在绑定事件的时候 例如click事件 ...
- jquery之on()绑定事件和off()解除绑定事件
off()函数用于移除元素上绑定的一个或多个事件的事件处理函数. off()函数主要用于解除由on()函数绑定的事件处理函数. 该函数属于jQuery对象(实例). 语法 jQuery 1.7 新增该 ...
- jQuery的live绑定事件在mobile safari(iphone / ipad / ipod)上失效的解决方案
jQuery的live绑定为什么会在mobile safari上失效呢?其实可以追溯到jQuery里live的实现方式.live的实现方式实际上是通过事件委托机制来实现的,也就是说是通过诸如冒泡的方式 ...
随机推荐
- Centos7.3安装Mysql5.7.26(glibc即linux通用版)
1.检查防火墙是否关闭 //查看防火墙状态 firewall-cmd --state //关闭防火墙 systemctl stop firewalld systemctl disable firewa ...
- spring jpa 学习笔记(一) 之集成
一.pom 配置 <?xml version="1.0"?> <project xsi:schemaLocation="http://maven.apa ...
- python之jupyter notebook
jupyter是一种交互式计算和开发环境的笔记,ipython命令行比原生的python命令行更加友好和高效,还可以运行web版的界面,支持多语言,输出图形.音频.视频等功能. 安装 pip inst ...
- js数据类型的转换
类型转换:就是把一种数据类型转换成另一种数据类型,在js中类型转换有以下三种情况:转数字,转字符串,转布尔值.对象转成这3种数据类型是没有意义的,对象里面可以放任意的数据类型. 在讲解类型转换之前,先 ...
- 《Redis高阶应用》讲座总结
数据结构延展 常用数据结构:String,Hash,List,Set,Sorted Set(不聊这些) 高级数据结构:Bitmaps,hyperloglog,GEO 单机拓展到分布式 为什么要分区:性 ...
- SQL Server 分页SQL
SELECT * FROM(SELECT ROW_NUMBER() OVER(order by Id DESC)AS rownum, (SELECT COUNT(*) FROM Ana_Strateg ...
- python之判断和循环
计算机之所以能做很多自动化的任务,因为它可以自己做条件判断.比如,输入用户年龄,根据年龄打印不同的内容,在Python程序中,可以用if语句实现: age = : print ('your age i ...
- thinkphp5.0 field和with连用的问题
field在with后面时field会不起作用,会查询数据库中全部的字段: field在with前面时会无法筛选联表的字段 解决办法把with换成join,field和join顺序无所谓 * @par ...
- DNS缓存失败怎么解决?
DNS的中文名是域名系统,是域名和IP地址相互映射的一个分布式数据库.有了DNS,我们上网时直接输入网站域名(即网址)即可,而不用输入网站的IP地址访问网站,对于用户来说比较方便记忆和访问. 每次当我 ...
- linux命令详解——sed
sed是一个很好的文件处理工具,本身是一个管道命令,主要是以行为单位进行处理,可以将数据行进行替换.删除.新增.选取等特定工作,下面先了解一下sed的用法 sed命令行格式为: se ...