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 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

Ads