jQuery .dblclick() event
Syntax and Description
.dblclick(handler)
.dblclick()
handler is a function to execute each time the event is triggered.
Return value is the jQuery object, for chaining purposes.
jQuery dblclick binds an event handler to the dblclick JavaScript event, or trigger that event on an element.
.dblclick(handler) is a shortcut for
.bind('dblclick', handler).
.dblclick() is a shortcut for .trigger('dblclick').
We can also trigger the event when a different element is clicked.
$('#other').click(function() {
$('#target').dblclick();
});
Bind double click event for paragraph
The following code binds the dblclick event on every paragraph on the page.
<html>
<head>
<script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){<!-- w ww .java 2 s . co m-->
var divdbl = $("div");
divdbl.dblclick(function () {
divdbl.toggleClass('dbl');
});
});
</script>
<style>
div.dbl { background:yellow;color:black; }
</style>
</head>
<body>
<body>
<div>java2s.com</div><span>Double click the block</span>
</body>
</html>
double click to slide up
The following code listens to the double click event and does slide up animation after double clicking.
<html>
<head>
<script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){<!--from w w w .jav a 2 s . com-->
$("p").dblclick(function () {
$(this).slideUp();
});
});
</script>
</head>
<body>
<body>
<p>java2s .com</p>
<p>j ava2s.com</p>
</body>
</html>