Maison >interface Web >js tutoriel >Obtenir l'identifiant du formulaire. Ce n'est pas ce que tu penses

Obtenir l'identifiant du formulaire. Ce n'est pas ce que tu penses

Susan Sarandon
Susan Sarandonoriginal
2024-10-02 18:18:29545parcourir

Getting form id. It is not what you think

J'ai eu un cas dans lequel j'avais ce formulaire :

<form id="hello">
   <input type="hidden" name="id" />
</form>

Et j'ai essayé de récupérer son identifiant en utilisant javascript :

const form  = document.getElementById("#hello")
console.log(form.id)

Mais cela a entraîné le retour du :

   <input type="hidden" name="id" />

HTMLElement à la place. Ainsi, afin d'atténuer ce problème, j'ai utilisé la fonction getAttribute à la place :

const form  = document.getElementById("#hello")
console.log(form.getAttribute('id'))

Où je l'ai utilisé

À première vue, l'exemple semble être un problème peu pertinent. Mais dans mon cas, je développais une bibliothèque d'utilitaires pour laquelle un HTMLElement était reçu en argument :

function formEnable(form,enable,resetFeedback=true){

    // checks whether for is an actual form are ommited for simplicity
    const formId = form.id
    const submitBtn = form.querySelector(`button[type="submit"]`)?? document.querySelector(`button[form="${formId}"][type="submit"]`) ?? document.querySelector(`button[form="${formId}"]`);

   if(!submitBtn){
        throw Error("Unable to enable or disable form")
   }
  // Form Enabling Logic
}

Dans mon cas, j'ai utilisé cette fonction pour placer une logique d'activation du formulaire et parce qu'une entrée cachée avec un identifiant de nom était comme champ de saisie dans mon formulaire. Le bouton n'a pas pu être récupéré.

Par conséquent, à la place, j'ai fait :

function formEnable(form,enable,resetFeedback=true){

    // checks whether for is an actual form are ommited for simplicity
    const formId = form.getAttribute('id');
    const submitBtn = form.querySelector(`button[type="submit"]`)?? document.querySelector(`button[form="${formId}"][type="submit"]`) ?? document.querySelector(`button[form="${formId}"]`);

   if(!submitBtn){
        throw Error("Unable to enable or disable form")
   }
  // Form Enabling Logic
}

Assurer que j'ai reçu l'attribut id concernant l'entrée et leurs noms qui existent dans mon formulaire.

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:
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