How Do I Run A JQuery Function When Any Link (a) On My Site Is Clicked

I have a new site build on corecommerce system which does not have much access to HTML and non to PHP. Only thing I can use is JavaScript. Their system is currently not great on pa

Solution 1:

Doing this will be easier if you include jQuery in your pages. Once that is done, you can do:

$('a').click(function() {
 // .. your code here ..
 return true; // return true so that the browser will navigate to the clicked a's href
}

Solution 2:

//to select all links on a page in jQuery
jQuery('a')

//and then to bind an event to all links present when this code runs (`.on()` is the same as `.bind()` here)
jQuery('a').on('click', function () {
    //my click code here
});

//and to bind to all links even if you add them after the DOM initially loads (`on()` is the same as `.delegate()` here; with slightly different syntax, the event and selector are switched)
jQuery(document).on('click', 'a', function () {
    //my click code here
});

Note: .on() is new in jQuery 1.7.

Solution 3:

what you are doing is binding the click handler to the document so where ever the user will click the code will be executed, change this piece of code

jQuery(document).click(function()

to

jQuery("a").click(function()

Solution 4:

$("a").click(function(){
 //show the busy image
});

Solution 5:

How about this - I assume #loading { display:none}

<div id="loading"><img src="http://www.cosmeticsbynature.com/00222-1/design/image/loading.gif" border=0></div>
<script type="text/javascript">
document.getElementById('loading').style.display='block'; // show the loading immediately
window.onload=function() 
  document.getElementById('loading').style.display='none'; // hide the loading when done
}
</script>