dblclick()是jQuery中的内置方法,用于触发双击事件的发生。双击所选元素时,将发生此方法。
用法:
$(selector).dblclick(args);
“selector”是选定的元素。
参数:它接受可选参数“args”,该参数指定双击后执行特定任务的函数。
返回值:双击所选元素时,它将返回某些函数。
代码1:
在下面的代码中,没有函数传递给该方法。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/
jquery/3.3.1/jquery.min.js"></script>
<script>
<!-- jQuery code to show dbclick method -->
$(document).ready(function() {
$("div").click(function() {
$("div").dblclick();
});
</script>
<style>
div {
display: block;
width: 370px;
padding: 10px;
font-size: 25px;
border: 2px solid green;
}
</style>
</head>
<body>
<!-- click on this div and a pop will appear -->
<div ondblclick="alert('dblclick event has been triggered')
">Click me to trigger dblclick event</div>
</body>
</html>
输出:
在双击“点击我触发dblclick事件”按钮之前,
双击“点击我触发dblclick事件”按钮后,
代码2:
在下面的代码中,函数被传递给dblclick()方法。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/
jquery/3.3.1/jquery.min.js"></script>
<script>
<!-- jQuery code to show dbclick method -->
$(document).ready(function() {
$("button").dblclick(function() {
$("p").fadeOut();
});
});
</script>
<style>
p {
display: block;
padding: 20px;
color: gree;
width: 300px;
border: 2px solid green;
font-size: 25px;
}
</style>
</head>
<body>
<p>Welcome to GeeksforGeeks !</p>
<!-- click on this button and above paragraph
will disappear -->
<button> Click Me! </button>
</body>
</html>
输出:
双击“Click Me”按钮之前,
双击“Click Me”按钮后,
相关用法
- JQuery eq()用法及代码示例
- JQuery after()用法及代码示例
- JQuery first()用法及代码示例
- JQuery val()用法及代码示例
- JQuery one()用法及代码示例
- JQuery has()用法及代码示例
- JQuery last()用法及代码示例
- JQuery on()用法及代码示例
- JQuery hasClass()用法及代码示例
- JQuery click()用法及代码示例
- JQuery stop()用法及代码示例
- JQuery queue()用法及代码示例
- JQuery not()用法及代码示例
- JQuery focus()用法及代码示例
- JQuery children()用法及代码示例
注:本文由纯净天空筛选整理自kundankumarjha大神的英文原创作品 jQuery | dblclick() with Examples。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。