ancres Désactiver dans Chrome/WebKit/Safari

Question

Considérez le code suivant:

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

Dans IE et FF, cela fera ancres cliquables, mais dans les navigateurs basés sur WebKit (Google Chrome et Safari), cela ne fait rien. La bonne chose à propos de l'attribut disabled est qu'il est facilement supprimé et n'affecte pas les attributs href et onclick.

Avez-vous des suggestions pour obtenir le résultat souhaité? Les réponses doivent être:

• Facilement être réversibles, puisque je veux désactiver les contrôles de saisie de formulaire pendant que je cours un appel AJAX.
• doit travailler dans IE, FF, et WebKit

Answer 1

Je suppose que vous avez un gestionnaire d'événements onclick lié à ces éléments d'ancrage. Faites en sorte que votre gestionnaire d'événements vérifie l'attribut "disabled" et annule l'événement s'il est défini. Votre gestionnaire d'événements doit ressembler à ceci:

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

Vous pouvez également définir une règle de style pour modifier le curseur. Edit - simplifie la vérification "disabled" comme suggéré dans les commentaires.

Answer 2

J'ai dû corriger ce comportement dans un site avec beaucoup d'ancres qui étaient activées/désactivées avec cet attribut selon d'autres conditions, etc. Peut-être pas idéal, mais dans une situation comme celle-là, si vous préférez ne pas fixer individuellement le code de chaque ancre, cela fera l'affaire pour tous les points d'ancrage:

$('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()); 
}); 

Et:

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

diableForms fonction