ansaurus

Question

jquery - Block specific links before a page fully loads and binds click events

Answer 1

+3 A:

Typically you'll avoid directly coding any href into the tag. Instead set href="javascript:void(0)" and handle the submission with jQuery.

Do something like this:

<a onclick="SomeJQueryCall()" href="javascript:void(0)">Click Me!</a>

And here's the jQuery script:

function SomeJQueryCall() {
    //ask the web server for some AJAX xml
    $.get(SomeUrl, null, SomeCallBackFunction(), "xml");
}

Rap 2009-10-27 10:46:38

thanks! this should work but we are trying to avoid inline scripting in pages markup and instead we try to manage all events bindings in external JS files

Saggi Malachi 2009-10-27 11:27:07

Answer 2

+3 A:

If you need to avoid inline scripting, then you could utilise jQuery's live() method to bind an event handler for elements that have not yet been added to the DOM:

1) Be sure to include jQuery in the <head> and not the <body>, since we need to initiate the following code before any elements in the body are created.

2) Include the following, also in the <head> (e.g. as an external js file):

$("a").live("click", function(){// Use a more specific selector than "a" if poss.
  getAjax( // This is your Ajax function. Adapt as required.
      $(this).attr('href') // Pass in the <a>'s href attribute.
  );
  return false; // Cancel the default click handler, to prevent page redirect.
});

Premasagar 2009-10-27 12:11:37

live() is very useful event, thanks

Prashant 2009-10-29 08:43:09

ansaurus

tags:

views:

answers:

jquery - Block specific links before a page fully loads and binds click events

related questions