jQuery bind() jQuerybind()|jQuery

本文概述

jQuery bind()事件的参数
jQuery bind()事件的示例
jQuery bind()事件的优点
具有mouseenter()和mouseleave()事件的jQuery bind()示例

jQuery bind()事件用于为一组元素中的选定元素附加一个或多个事件处理程序。它指定事件发生时要运行的功能。
它通常与jQuery的其他事件一起使用。
句法：

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

jQuery bind()事件的参数

参数	描述
Event	它是必填参数。它指定一个或多个事件附加到元素。如果要添加多个事件, 则必须将它们用空格隔开。
Data	它是一个可选参数。它指定了要传递给函数的其他数据。
Function	它是必填参数。它执行事件发生时要运行的功能。
Map	它指定了一个事件映射, 其中包含一个或多个附加到元素的事件或函数。

jQuery bind()事件的示例让我们以一个示例来演示jQuery bind()事件。

< !DOCTYPE html> < html> < head> < script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> < /script> < script> $(document).ready(function(){ $("p").bind("click", function(){ alert("This paragraph was clicked."); }); }); < /script> < /head> < body> < p> Click on the statement.< /p> < /body> < /html>

立即测试
输出：
单击该语句。
jQuery bind()事件的优点

它与各种浏览器兼容。
绑定事件处理程序非常简单快捷。
它提供了一些带有click(), hover()等事件的简便方法, 用于绑定事件处理程序。

具有mouseenter()和mouseleave()事件的jQuery bind()示例让我们以带有mouseenter()和mouseleave()事件的jQuery bind()为例。

< !DOCTYPE html> < html lang="en"> < head> < meta charset="utf-8"> < title> bind demo< /title> < style> p { background: yellow; font-weight: bold; cursor: pointer; padding: 5px; } p.over { background: #ccc; } span { color: red; } < /style> < script src="http://img.readke.com/220429/1J91M4B-1.jpg"> < /script> < /head> < body> < p> Click or double click on the statement.< /p> < span> < /span> < script> $( "p" ).bind( "click", function( event ) { var str = "( " + event.pageX + ", " + event.pageY + " )"; $( "span" ).text( "This is a single click! " + str ); }); $( "p" ).bind( "dblclick", function() { $( "span" ).text( "This is a double click on " + this.nodeName ); }); $( "p" ).bind( "mouseenter mouseleave", function( event ) { $( this ).toggleClass( "over" ); }); < /script> < /body> < /html>

【jQuery bind()】立即测试