anclas Deshabilitar Chrome/Safari/WebKit

Question

Considere el siguiente código:

$("a").attr("disabled", "disabled"); 

En IE y FF, esto hará que los anclajes permite hacer clic, pero en los navegadores basados ​​en WebKit (Safari y Google Chrome) esto no hace nada. Lo bueno del atributo disabled es que se elimina fácilmente y no afecta los atributos href y onclick.

Tiene alguna sugerencia sobre cómo obtener el resultado deseado. Las respuestas deben ser:

• Seré fácilmente revertable, ya que quiero deshabilitar los controles de entrada de formulario mientras tengo una llamada AJAX ejecutándose.
• deben trabajar en el IE, FF, y WebKit

Answer 1

que se supone que tiene un controlador de eventos onclick con destino a estos elementos de anclaje. Simplemente haga que su controlador de eventos verifique el atributo "deshabilitado" y cancele el evento si está configurado. Su controlador de eventos sería algo como esto:

$("a").click(function(event){ 
    if (this.disabled) { 
    event.preventDefault(); 
    } else { 
    // make your AJAX call or whatever else you want 
    } 
}); 

También puede establecer una regla de estilo para cambiar el cursor.

a[disabled=disabled] { cursor: wait; } 

Editar - simplificó la verificación de "deshabilitado" como se sugiere en los comentarios.

Answer 2

Tuve que corregir este comportamiento en un sitio con muchos anclajes que se estaban habilitando/deshabilitando con este atributo de acuerdo con otras condiciones, etc. Quizás no sea ideal, pero en una situación como esa, si prefieres no hacerlo fijar el código de cada anclaje individual, esto va a hacer el truco para todos los anclajes:

$('a').each(function() { 
    $(this).click(function (e) { 
     if ($(this).attr('disabled')) { 
      e.preventDefault(); 
      e.stopImmediatePropagation(); 
     } 
    }); 
    var events = $._data ? $._data(this, 'events') : $(this).data('events'); 
    events.click.splice(0, 0, events.click.pop()); 
}); 

Y:

a[disabled] { 
    color: gray; 
    text-decoration: none; 
}