Maison > interface Web > js tutoriel > Comment puis-je déclencher des événements sur des éléments d'entrée désactivés dans des navigateurs comme Firefox ?

Comment puis-je déclencher des événements sur des éléments d'entrée désactivés dans des navigateurs comme Firefox ?

Patricia Arquette
Libérer: 2024-12-19 08:40:16
original
845 Les gens l'ont consulté

How Can I Trigger Events on Disabled Input Elements in Browsers Like Firefox?

Solution de contournement pour les événements sur les éléments d'entrée désactivés

Les éléments d'entrée désactivés ne déclenchent généralement pas d'événements de souris. Alors que la plupart des navigateurs propagent les événements des éléments désactivés vers leurs conteneurs parents, Firefox ne prend pas en charge ce comportement. Cela peut poser des défis pour certains scénarios.

Problème :

Vous devez gérer les événements sur les éléments d'entrée désactivés, mais le comportement par défaut l'empêche.

Solution :

Pour surmonter ce problème, une technique peut être utilisée pour intercepter les événements d'un élément d'entrée désactivé et déclencher un clic sur un élément adjacent qui n'est pas désactivé.

Voici un exemple d'implémentation utilisant HTML et jQuery :

<div>
Copier après la connexion
$("div > div").click(function (evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});
Copier après la connexion

Dans cet exemple, l'élément div chevauche l'entrée désactivée élément. Lorsque l'on clique sur le div, il déclenche un clic sur l'élément d'entrée, qui à son tour active l'élément d'entrée et définit le focus sur lui.

Exemple :

Visitez le exemple suivant JSFiddle pour voir cette technique dans action :

https://jsfiddle.net/RXqAm/170/

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal