jQuery click() and dblclick() events are the most common used mouse events :

  1. click() – Fire when mouse single click on the matched element.
  2. dblclick() – Fire when mouse double clicks on the matched element.

Try it yourself


<html>
<head>

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>

<style type="text/css">
	#singleClick, #doubleClick{
		float:left;
		padding:8px;
		margin:16px;
		border:1px solid blue;
		width:150px;
		height:150px;
		background-color:#999966;
	}
	
</style>

</head>

<body>

<h1>jQuery click() and dblclick() example</h1>

<div id="singleClick">
	Single Click Me
</div>

<div id="doubleClick">
	Double Clicks Me
</div>

<script type="text/javascript">
		
$('#singleClick').click(function(){
	$('#singleClick').slideUp();
});

$('#doubleClick').dblclick(function(){
	$('#doubleClick').fadeOut();
});

</script>

</body>
</html>