Share on Google+Share on Google+

Display two alert box alternately by clicking on text

Advertisement
In this tutorial , we will discuss about how to display two alert box alternately by clicking on text line.

Display two alert box alternately by clicking on text

In this tutorial , we will discuss about how to display two alert box alternately by clicking on text line. In this example, a text line is given ,when we click on it ,it will show a alert box. But when we click on it again , it shows second alert box. It appears one by one. This is due to toggle effect of jQuery.

jqToggleOutputLine.html

<!DOCTYPE html>
<html>
<head>
<script src="jquery-1.4.2.js" type="text/javascript"></script>
</head>
<body>
<div id="target">
Click here to see toggle effect
</div>
<script>
$(document).ready(function(){
$("#target").toggle(
function(){
alert("This is the FIRST handler for toggle() effect");
},
function(){
alert("This is the SECOND handler for toggle() effect");
});
});
</script>
</body>
</html>

OUTPUT

After clicking on given line ,the output will be :

After clicking on it second time :

Download Source Code

Click here to see demo

Advertisements

Advertisement

Posted on: July 28, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial 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.