Taglive

[jQuery] Vérifier en cours de saisie en live si un input[type= »text »] contient du contenu avec l’événement Input et la méthode Val

Dans l’exemple qui suit, on procède à cette vérification pour désactiver une fonctionnalité de Collapse (Bootstrap) des champs de formulaires si du texte est saisi.

Si un seul champ à vérifier:

Si le champ qui a le focus n’est pas vide, on agit sur #triggerBillingAddressExtraInfo en ajoutant un style inline pointer-events: none; (qui désactive la possibilité de cliquer sur l’élément).

Si plusieurs champs à vérifier:

Sources: jQuery check if any text input has value et Detect changed input text box.

Si le champ qui a le focus n’est pas vide, on agit sur #triggerBillingAddressExtraInfo en ajoutant un style inline pointer-events: none; (qui désactive la possibilité de cliquer sur l’élément).

On ajoute la condition: si tous les champs au sein de #collapseBillingAddressExtraInfo sont vides, on retire le style inline pointer-events: none;.

Mieux, avec deux fonctions

[JQuery] J’ai mis jQuery à jour et la fonction .live() ne fonctionne plus. Méthode de migration.

UPDATE : jquery-migrate – Migrate older jQuery code to jQuery 1.9+.

Sources : http://stackoverflow.com/questions/14354040/jquery-1-9-live-is-not-a-function | http://stackoverflow.com/questions/14703646/jquery-how-to-use-the-on-method-instead-of-live/14703668#14703668

A lire avant que vous n’entrepreniez un Rechercher et Remplacer automatique:

Pour une migration rapide sur un site en production, ne vous contentez pas d’un remplacement automatique du mot-clé live par on, car les paramètres des deux fonctions sont différents :

devrait devenir :

La présence du sélecteur est très importante! Si vous n’avez pas besoin de l’utiliser, déclarez le comme null.


Migration Example 1:

Avant :

Après, il faut déplacer l’élément enfant (a) sur le paramètre selector de la fonction .on() :


Migration Example 2:

Avant :

Après, il faut déplacer l’élément (.myButton) sur le paramètre selector de la fonction .on(), et cible l’élément parent le plus proche (de préférence un ID) :

Si vous ne savez pas quoi mettre comme élément parent, body fonctionne toujours :


Migration Example 3 :

Avant :

Après :

© 2020 devfrontend.info

Theme by Anders NorénUp ↑