在jQuery中,我们可以使用one()方法为元素添加一个“只触发一次”的事件。
语法:
$().one(type, fn)
说明:
type是必选参数,它是一个字符串,表示事件类型。fn也是必选参数,表示事件的处理函数。
举例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/jquery-1.12.4.min.js"></script>
<script>
$(function () {
$("#btn").one("click", function(){
alert("欢迎来到绿叶学习网!");
})
})
</script>
</head>
<body>
<input id="btn" type="button" value="按钮" />
</body>
</html>
浏览器预览效果如图所示。
分析:
在这个例子中,我们使用one()方法为按钮添加了一个只触发一次的click事件。第一次点击按钮后会弹出对话框,而第二次点击时就没有任何反应了,这是因为click事件已经被解除。
实际上,对于one()方法,我们可以使用on()和off()这两个方法模拟出来。
$("#btn").one("click", function(){
alert("欢迎来到绿叶学习网!");
})
上面这段代码可以等价于:
$("#btn").on("click", function(){
alert("欢迎来到绿叶学习网!");
$(this).off("click");
})