jQuery bind()方法用于给选定的一个或多个元素绑定一个或多个事件处理程序。它指定事件发生时要运行的函数。

语法

$(selector).bind(event,data,function,map)

参数

参数说明
event为必填参数。它指定附加到元素的一个或多个事件。如果要添加多个事件，它们必须用空格分隔。
data这是一个可选参数。它指定要传递给函数的附加数据。
function这是一个必填参数。它执行事件发生时运行的函数。
map它指定一个事件映射，其中包含一个或多个附加到元素的事件或函数.

例子

例1

绑定click 点击事件

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<script>
$(document).ready(function(){
    $("p").bind("click", function(){
        alert("被点击.");
    });
});
</script>
</head>
<body>
<p>点击查看效果.</p>
</body>
</html>

例2

绑定单机、双击事件、mouseenter() 和 mouseleave() 事件

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <title>bind()绑定元素例子</title>
  <style>
  p {
    background: yellow;
    font-weight: bold;
    cursor: pointer;
    padding: 5px;
  }
  p.over {
     background: #ccc;
  }
  span {
    color: red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>单击或双击语句.</p>
<span></span>
<script>
//绑定单击
$( "p" ).bind( "click", function( event ) {
  var str = "( " + event.pageX + ", " + event.pageY + " )";
  $( "span" ).text( "这是一次点击！" + str );
});
//绑定双击
$( "p" ).bind( "dblclick", function() {
  $( "span" ).text( "这是双击" + this.nodeName );
});
	
$( "p" ).bind( "mouseenter mouseleave", function( event ) {
  $( this ).toggleClass( "over" );
});
</script>
</body>

</html>