When multiple controls needs to fire a same event.
Instead of binding the event to each control separately , we can create an array of controls and loop through it to bind the single event as following :
Code :
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Single Event for Multiple Controls</title>
<script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
var btns = $('#btnA,#btnC,#btnE');
$.each(btns, function() {
$(this).click(function() {
alert(this.id);
});
});
});
</script>
</head
<body>
<input id="btnA" type="button" value="Button A" />
<input id="btnB" type="button" value="Button B" />
<input id="btnC" type="button" value="Button C" />
<input id="btnD" type="button" value="Button D" />
<input id="btnE" type="button" value="Button E" />
</body>
</html>