[jQuery] how to streamline my code with Event Delegation?
i'm sure the jQuery i'm using below is very ineffiecient. the only
syntax that changes are the numbers in the names of my IDs and my
variables - and even they're matching. everything else is constant.
i'm told that "event delegation" is the answer, but cant rewrite the
code appropriately (i tried, but just made a mess of things -
rookie).
so could someone kindly show me how to streamline the the below with
event delgation.
thanks.
jQuery:
$('#link01').click(function(){
$.get("myPage.asp", { myVar: "v01" },
function(data) {
document.getElementById('contentarea').innerHTML =
data;
mySlideEffect(); });
});
$('#link02').click(function(){
$.get("myPage.asp", { myVar: "v02" },
function(data) {
document.getElementById('contentarea').innerHTML =
data;
mySlideEffect(); });
});
.... etc. ...
$('#link99').click(function(){
$.get("myPage.asp", { myVar: "v99" },
function(data) {
document.getElementById('contentarea').innerHTML =
data;
mySlideEffect(); });
});
HTML:
<A HREF=# id=link01>page1</A>
<A HREF=# id=link02>page2</A>
... etc ...
<A HREF=# id=link99>page3</A>
<div id="contentarea">
Loaded content slides in with this DIV.
</div>