im messing around with some jQuery and want to disable a link whilst it performs a ajax post (its adding/fetching somthing from a database) and i want to disable the link so it cant be multiclickd.

<a href=\"#\" id=\"seepages\">See Page</a>

ive tried using


but that dosnt work! =(
how ever when i tried this

$("#seepages").attr("id", "disabled");

that works! but using either one of them by them self doesn't - work but why?

any advice/tips would be useful! thanks in advance =)

i should also have said that i have to use:

$("#disabled").attr("id", "seepages"); 

to enable it again


There are several ways to aproach this.

My preferred methods are:-

  • Disable the html element (input field or button) which stimulates the ajax action. This method is good (when available) in that it is (a) simple and (b) gives the user a useful indication that the action is disabled.
  • Test an "allow" flag when an ajax function is initiated and return out of the function if the glag is down. Otherwise, lower the flag for the durationof the server-side ajax call and raise it again as the response handler completes. This method is good if multiple events can stimulate the ajax action as it gives a single point of control.

Approach 2 looks something like this

var allowAjaxAction = true;
function ajaxAction(){
	if(!allowAjaxAction) { return; }
	allowAjaxAction = false;
	// ...
	var httpRequest = createRequestObject();
	// ...
	httpRequest.onreadystatechange = function() {
		// ...
		allowAjaxAction = true;
	// ...

This may need to be reframed slightly in a jquery context.


Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.