jQuery and ASP.NET

February 5, 2010

Simultaneously add Multiple Event Handlers to a Selector using jQuery 1.4




With jQuery 1.4, you can add multiple event handlers to a selector by passing a map of event type/handler pairs as shown below:

<html>
<
head>
<
title>Bind Multiple Event Handlers</title>
<
style type="text/css">
.divOne{
height:40px;
width:100px;
background-color:#808080;
}
</style>
<
script language="javascript" type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js">
</
script>
<
script language="javascript" type="text/javascript">
$(function() {
$('.divOne').bind({
mouseenter: function() {
$(this).css("background-color", "#f0f0f0");
},
mouseout: function() {
$(this).css("background-color", "#808080");
},
click: function() {
alert("Div was clicked");
}
});
});
</script>
</
head>
<
body>
<
form>
<
div class="divOne">
</
div>
</
form>
</
body>
</
html>

See a Live Demo

Note: In the previous version, you could bind one function to multiple events.


Bookmark this link on del.icio.us (saved by 0 users)

Did you like this post?
kick it on DotNetKicks.com
subscribe via rss subscribe via e-mail
print this post follow me on twitter
Others Also Read..

comments

1 Response to "Simultaneously add Multiple Event Handlers to a Selector using jQuery 1.4"
  1. night-fairy-tales.com said...
    February 8, 2010 11:45 PM

    Interesting possibility. Thanks

 

Copyright 2010 All Rights Reserved DevCurry.com by Suprotim Agarwal