语法:
$(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();
})