Home Tutorial Jquery jQuery '.live' & '.die' Mouse events

 
 

Share on Google+Share on Google+
jQuery '.live' & '.die' Mouse events
Posted on: August 3, 2010 at 12:00 AM
Advertisement
In this tutorial ,we will discuss about how to remove an event using 'die' mouse event of jQuery.

jQuery '.live'  & '.die' Mouse events

In this tutorial ,we will discuss about how to  remove an event using 'die' mouse event of jQuery. In this Example, we removes the 'click' event of a button by clicking on other button. First button is for enabling event , Second is for removing event and third button is the one whose event are adding & removing.

removeEvent.html

<!DOCTYPE html>
<html>
<head>
<style>
button { margin:5px; }
button#theone { color:red; background:blue; }
</style>
<script src="jquery-1.4.2.js"></script>
</head>
<body>
<button id="theone">click not working</button>
<button id="bind">Enable Click</button>
<button id="unbind">Disable Click</button>
<br><b><font color="purple">
After enable/disable click , click on blue button to see effect of die event
</font></b>
<div style="display:none; color:red;">Button Clicked!</div>
<script>

function aClick() {
$("div").show().fadeOut("slow");
}
$("#bind").click(function () {
$("#theone").live("click", aClick).text("click working");
});
$("#unbind").click(function () {
$("#theone").die("click", aClick).text("click not working");
});
</script>
</body>
</html>

OUTPUT

Before Clicking :

After Clicking "Enable click" , clicking on blue button gives output :

Download Source Code

Click here to see demo

Advertisement

Related Tags for jQuery '.live' & '.die' Mouse events:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: August 3, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com