web-dev-qa-db-fra.com

Est-il possible de désactiver onclick sans altérer sa fonction?

La manière dont je sais comment désactiver un événement onclick sur un élément est la suivante:

element.onclick = null;

Autoriser:

element.onclick = function(){
   // something
};

ou

element.addEventListener("click", me);

C'est bien, mais lorsque vous avez plusieurs éléments - chacun ayant la même fonction avec des paramètres différents - cela devient un peu gênant d'utiliser cette méthode. Est-il possible de le désactiver sans sacrifier la fonction initiale avec ses paramètres?

Je souhaite conserver la fonction telle quelle sans avoir à la définir sur null ou sur un autre paramètre afin de la désactiver.

16
user9697902

Utilisez l'attribut disabled pour désactiver un bouton.

<button onclick="alert('clicked')">Enabled</button>
<button onclick="alert('clicked')" disabled>Disabled</button>

L'avantage de cette méthode (par rapport aux "événements de pointeur" suggérés dans une autre réponse) est qu'elle ne vous empêchera pas uniquement d'utiliser le bouton en tant qu'utilisateur de souris, mais également les technologies d'assistance et les utilisateurs du clavier.

En JavaScript, vous pouvez désactiver ou activer l'attribut avec:

el.disabled = true;   // Disable.
el.disabled = false;  // Enable.

Ou avec jQuery vous pouvez faire:

$('button').prop('disabled', true);   // Disable.
$('button').prop('disabled', false);  // Enable.
18
Don Cruickshank

Vous pouvez le faire en css.

<button onclick="alert('clicked')">Can click</button>
<button onclick="alert('clicked')" style="pointer-events: none;">Cannot click</button>

Pro: ça marche sur tous les éléments HTML

Con: il n'empêche pas l'action du clavier

6
Alexandre Annic