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。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。