


Utilisez le masque DIV pour résoudre le problème des cases à cocher non valides directement sélectionnées par la production de pages mouse_HTML/Xhtml_Web
May 16, 2016 pm 04:37 PMAu cours du processus de développement front-end, j'ai rencontré une situation nécessitant une vérification. Pour la commodité des opérations de l'utilisateur, l'événement click a été placé sur le DIV. (Knockout.js est utilisé)
Le code est à peu près le suivant :
<div id="one" data-biind="click:clickevent">
<input type="checkbox"><span> S'il vous plaît, vérifiez-moi si vous avez des questions< ;/span>
</div>
Mais il y a un phénomène étrange lorsque vous écrivez comme celui-ci.
Mais il n'est pas normal de cocher directement la case avec la souris :
La case à cocher est dans un état non coché, et la souris clique directement sur la case à cocher pour cocher ce qui suit. doit être réalisé : 1. Exécutez l'événement clickevent du div 2. , une fois l'événement exécuté, la case à cocher est cochée ;
Mais le résultat final est que la case n'est toujours pas cochée.
Le résultat du suivi et du débogage est que lorsque l'événement clickevent est exécuté, la case à cocher est toujours à l'état coché, mais après l'exécution de l'événement clickevent, l'exécution du code jquery est entrée après deux ou trois étapes. la case à cocher passe à l'état Non sélectionné.
La raison n'a pas encore été trouvée. (La radiobox utilisée à un autre endroit a une situation similaire)
Il n'y a pas d'autre moyen que de contourner ce problème en recouvrant la case à cocher avec une couche de div, de sorte que lorsque la souris clique, le div soit cliqué. au lieu de la case à cocher. Via clickevent Changer le statut de la case à cocher (il existe un code pour changer le statut de la case à cocher dans l'événement clickevent)
est implémenté comme suit :
<div id="one"> " data-bind="click:clickevent">< /div>
<div id="trois">
<input type="checkbox"/> <span>Veuillez cocher moi si vous avez des questions</span>
</div> ;
</div>
L'attribut z-index du div sur la couche supérieure est plus grand que le div sur la couche inférieure.
L'attribut ID du DIV ci-dessus est juste à titre d'illustration. Dans les programmes généraux, l'attribut class est utilisé pour le définir.

Article chaud

Outils chauds Tags

Article chaud

Tags d'article chaud

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Comment utiliser CSS pour se rendre compte qu'il manque un coin à un div

Implémentation d'un script de navigateur de traduction de marquage de mots basé sur l'API ChatGPT

Quelles sont les différences entre div et span ?

Quel est le modèle de boîte de division ?

Quelle est la différence entre iframe et div

Comment afficher deux divs côte à côte

Comment masquer le contenu CSS Div au-delà
