bind()是jQuery中的内置方法,用于为所选元素附加一个或多个事件处理程序,并且此方法指定事件发生时要运行的函数。
用法:
$(selector).bind(event, data, function);
参数:它接受下面指定的三个参数-
- event:这是事件类型,将传递给所选元素。
- data:这是可以在所选元素上显示的数据。
- function:这是由所选元素执行的函数。
返回值:它返回对选定元素所做的所有修改。
代码1:
在下面的代码中,使用此方法将“ click”事件附加到给定的段落中。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/
jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("p").bind("click", function() {
alert("Given paragraph was clicked.");
});
});
</script>
<style>
p {
display: block;
padding: 50px;
width: 280px;
border: 2px solid green;
}
</style>
</head>
<body>
<p>Click me!</p>
</body>
</html>
输出:
在单击“Click me”框之前,
点击“Click me”框后,
代码2:
在下面的代码中,添加了相同的“click”事件,但是这次数据也传递给此方法。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/
jquery/3.3.1/jquery.min.js"></script>
<script>
function handlerName(e) {
alert(e.data.msg);
}
<!--Here data is passing along with a function in
bind method-->
$(document).ready(function() {
$("p").bind("click", {
msg: "You just clicked the paragraph!"
}, handlerName)
});
</script>
<style>
p {
display: block;
padding: 50px;
width: 280px;
border: 2px solid green;
}
</style>
</head>
<body>
<!--A pop will appear after clicking on this paragraph-->
<p>Click me!</p>
</body>
</html>
输出:
在单击“Click me”框之前,
点击“Click me”框后,
相关用法
- JQuery one()用法及代码示例
- JQuery has()用法及代码示例
- JQuery on()用法及代码示例
- JQuery last()用法及代码示例
- JQuery eq()用法及代码示例
- JQuery after()用法及代码示例
- JQuery first()用法及代码示例
- JQuery val()用法及代码示例
- JQuery empty()用法及代码示例
- JQuery slideUp()用法及代码示例
- JQuery prop()用法及代码示例
- JQuery removeProp()用法及代码示例
- JQuery slice()用法及代码示例
注:本文由纯净天空筛选整理自kundankumarjha大神的英文原创作品 jQuery | bind() with Examples。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。