Maison interface Web js tutoriel Pourquoi ne puis-je pas modifier le « type » d'un champ de saisie du mot de passe au texte avec jQuery ?

Pourquoi ne puis-je pas modifier le « type » d'un champ de saisie du mot de passe au texte avec jQuery ?

Nov 16, 2024 am 05:08 AM

Why Can't I Change an Input Field's 'type' from Password to Text with jQuery?

Modifier le type de champ de saisie avec jQuery : pourquoi cela peut ne pas fonctionner

Lorsque vous essayez de modifier un champ de saisie d'un type de mot de passe à un tapez du texte à l'aide de jQuery, vous pouvez rencontrer un problème où la modification ne prend pas effet.

Voici le code en question :

$(document).ready(function() {
    // #login-box password field
    $('#password').attr('type', 'text');
    $('#password').val('Password');
});

Ce code vise à modifier le champ de saisie avec un identifiant de "mot de passe" dans un champ de texte, puis remplissez-le avec le texte "Mot de passe". Cependant, il peut échouer en raison du modèle de sécurité du navigateur.

Les tests dans Safari affichent une erreur indiquant que la propriété type ne peut pas être modifiée. Ceci est également pris en charge par le code source de jQuery, qui contient une vérification :

if ( name == "type" && jQuery.nodeName( elem, "input" ) && elem.parentNode )
    throw "type property can't be changed";

Cette vérification empêche la modification de la propriété type pour les champs de saisie dans Internet Explorer. On ne sait pas s'il s'agit d'un bug ou d'un choix de conception de sécurité.

Pour surmonter ce problème, vous pouvez utiliser la manipulation native du DOM au lieu de jQuery. Voici comment :

var pass = document.createElement('input');
pass.type = 'password';
document.body.appendChild(pass);
pass.type = 'text';
pass.value = 'Password';

Ce code réussira à modifier le champ de saisie en type de texte et à le remplir avec la valeur spécifiée.

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!

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

Outils d'IA chauds

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Stock Market GPT

Stock Market GPT

Recherche d'investissement basée sur l'IA pour des décisions plus intelligentes

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

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

Comment sélectionnez-vous les éléments par un attribut de données dans JavaScript? Comment sélectionnez-vous les éléments par un attribut de données dans JavaScript? Aug 30, 2025 am 01:57 AM

Vous pouvez sélectionner des éléments avec des attributs de données dans JavaScript via le sélecteur d'attribut CSS et utiliser la méthode document.QuerySelector () ou document.QuerySelectorAll () pour y parvenir. 1. Utiliser [Data-Attribute] pour sélectionner un élément avec l'attribut de données spécifié (n'importe quelle valeur); 2. Utilisez [data-attribut = "Value"] pour sélectionner un élément dont la valeur d'attribut correspond exactement; 3. Accédez à l'attribut de données via Element.Dataset, où Data-User-ID correspond à DataSet.Userid (Remplacer

Pytest et sélénium: stratégies de mise en œuvre pour les tests dynamiques basés sur les données Pytest et sélénium: stratégies de mise en œuvre pour les tests dynamiques basés sur les données Aug 30, 2025 am 06:00 AM

Cet article vise à résoudre le problème selon lequel le décorateur de @ pytest.mark.Marametrise ne peut pas gérer directement les données générées lors de l'exécution lors de l'utilisation de PyTest et du sélénium pour des tests dynamiques basés sur les données. Nous explorerons les limites de pytest.mark.Parametrize en profondeur et introduirons en détail comment implémenter gracieusement les tests paramétrés en fonction de l'acquisition de données dynamiques de sélénium via la fonction de crochet Pytest_GenEReate_tests de Pytest pour assurer la flexibilité et l'efficacité des cas de test.

Optimiser la gestion des événements des sauts de liaison externe dynamique dans la fenêtre contextuelle jQuery Optimiser la gestion des événements des sauts de liaison externe dynamique dans la fenêtre contextuelle jQuery Sep 01, 2025 am 11:48 AM

Cet article vise à résoudre le problème de la redirection du bouton de redirection de liaison externe dans la fenêtre pop-up jQuery provoquant des erreurs de saut. Lorsqu'un utilisateur clique sur plusieurs liens externes successivement, le bouton Jump dans la fenêtre contextuelle peut toujours pointer vers le premier lien cliqué. La solution principale consiste à utiliser la méthode OFF ('Click') pour annuler l'ancien gestionnaire d'événements avant chaque liaison d'un nouvel événement, garantissant que le comportement de saut pointe toujours vers l'URL cible, réalisant ainsi une redirection de liens précise et contrôlable.

Créer des compteurs JavaScript en cours d'exécution par les jours ouvrables et les heures de travail Créer des compteurs JavaScript en cours d'exécution par les jours ouvrables et les heures de travail Aug 31, 2025 am 06:30 AM

Cet article détaille comment créer un compteur de synchronisation précis à l'aide de JavaScript. Le comptoir est incrémenté une fois par minute, mais ne se déroule que dans les jours ouvrables prédéfinis (du lundi au vendredi) et les heures de travail (comme 6 h à 20 h). Il peut interrompre les incréments pendant les heures de travail, mais afficher la valeur actuelle et réinitialiser automatiquement le premier jour de chaque mois, assurant la précision et la flexibilité de la logique de comptage.

Comment les éléments DOM créés dynamiquement sont accessibles et exploités par des scripts préchargés Comment les éléments DOM créés dynamiquement sont accessibles et exploités par des scripts préchargés Aug 30, 2025 am 11:57 AM

Cet article explore comment les scripts JavaScript peuvent être effectivement accessibles et manipulés lorsqu'ils sont chargés et exécutés avant la création d'éléments DOM dans le développement Web. Nous présenterons trois stratégies de base: passer directement les références d'élément via des valeurs de retour de fonction, en utilisant des événements personnalisés pour réaliser une communication intermodule et en utilisant MutationObserver pour écouter les changements de structure DOM. Ces méthodes peuvent aider les développeurs à résoudre les défis entre le synchronisation de l'exécution JavaScript et le chargement dynamique du contenu, garantissant que le script peut fonctionner correctement des éléments ajoutés par la suite, tels que les rendre glisserables.

L'évolution de JavaScript: un regard sur ES2023 et au-delà L'évolution de JavaScript: un regard sur ES2023 et au-delà Aug 29, 2025 am 12:18 AM

ES2023 a introduit un certain nombre de mises à jour pratiques, marquant l'évolution mature de JavaScript. 1.Array.prototype.Findlast () et FindLasTindex () Les méthodes prennent en charge la recherche à partir de la fin du tableau, améliorant l'efficacité des journaux ou configurations de traitement; 2.Hashbang Syntax (#! / Usr / bin / envNode) permet d'exécuter les fichiers JavaScript directement dans des systèmes de type Unix; 3.Error.Cause prend en charge les chaînes d'erreur, améliorant les capacités de débogage des exceptions; 4. Les spécifications des faibles et des ensembles améliorent la cohérence des moteurs transversales; À l'avenir, les décorateurs (stade3), les disques et les tuples (

Comment mettre à jour les propriétés des objets en javascript Comment mettre à jour les propriétés des objets en javascript Sep 04, 2025 am 04:58 AM

UsedotNotationToupDateProperties dans les noms de connaissances; 2.UsebracketnotationfordynAmicorSpecialCharacterPropertyNames; 3.UseObject.assign () ToupdateMultiplepropertiesormergeObjects, notedingitMutatestheoriginalSanempyObjectisSusedArfirStargUment; 4.usethesppyples

JavaScript réalise l'effet de commutation d'image click-through: tutoriel professionnel JavaScript réalise l'effet de commutation d'image click-through: tutoriel professionnel Sep 18, 2025 pm 01:03 PM

Cet article présentera comment utiliser JavaScript pour réaliser l'effet de cliquer sur les images. L'idée principale est d'utiliser l'attribut Data- * de HTML5 pour stocker le chemin d'image alternatif et écouter des événements de clic via JavaScript, changez dynamiquement les attributs SRC, réalisant ainsi la commutation d'image. Cet article fournira des exemples de code et des explications détaillés pour vous aider à comprendre et à maîtriser cet effet interactif couramment utilisé.

See all articles