Comment sélectionner des éléments de formulaire en jQuery?

J'ai deux formulaire comme ceci:

<form id='form1' name='form1'>
  <input name='name' id='name'>
  <input name='name2' id='name2'>
</form>

<form id='form2' name='form2'>
  <input name='name' id='name'>
  <input name='name2' id='name2'>
</form>

Maintenant, je veux insérer du texte dans nom champ de form2. Je suis à l'aide de suivants code jQuery mais il remplir nom champ de form1.

$("#name").val('Hello World!');

Alors comment sélectionner des éléments de formulaire seulement?

InformationsquelleAutor Awan | 2010-12-08
  1. 122

    Ce n'est pas d'avoir le même ID à deux reprises, c'est pourquoi #name ne trouve que la première.

    Vous pouvez essayer:

    $("#form2 input").val('Hello World!');

    Ou,

    $("#form2 input[name=name]").val('Hello World!');

    Si vous êtes coincé avec une défaillance de page et souhaitez sélectionner tous les #names, vous pouvez utiliser le sélecteur d'attributs sur l'id:

    $("input[id=name]").val('Hello World!');
    • +1 Merci. Encore une chose, si je veux choisir deux champs d'un formulaire spécifique, à l'aide de plusieurs sélecteur.
    • $( '#formId field1Id, #formId field2Id' )
    • Une autre option est $('#form2 input') pour tous les champs de saisie, ou $('#form2 input').filter('[name=name1], [name=name2]')
    • Merci
    • bien sûr, vous aurez besoin #field1Id et #field2Id, et je ne suis pas sûr de savoir comment ce serait de se comporter avec dupliqué Id.
    • oh pinaise! Vous avez tout à fait raison. J'ai oublié les codes de hachage. Montage 🙂 Concernant les Id en double, je pensais que la question était générique et non spécifique à cet exemple particulier de l'invalidité de balisage 🙂
    • Hmm... ne pouvez pas éditer mon premier commentaire?
    • Eh bien, si l'ID est unique, vous n'avez pas vraiment sous quelle forme il est :). Mais il est assez commun d'écrire des scripts pour les pages existantes, de sorte que ce problème ne se lève.
    • Bon point sur l'ID. Il est 5 h 30. Je devrais arrêter d'essayer de répondre aux questions et de frapper le sac. Je blâme la dépravation de sommeil 🙂
    • fantastique le meilleur de la syntaxe de l'homme 🙂
    • avec de nombreux éléments d'utiliser $("#feuil2").find("#id1,#Id2#id3") s'ils ne sont pas les enfants de la form2, ou $("#feuil2").les enfants("#id1,#Id2#id3") s'ils sont

    InformationsquelleAutor Kobi
  2. 8

    bien qu'il n'est pas valide html, mais vous pouvez utiliser le sélecteur de contexte afin de limiter votre sélection
    dans votre cas, il serait comme :

    $("input[name='name']" , "#form2").val("Hello World! ");

    http://api.jquery.com/jquery/#selector-context

    • Il est intéressant de noter que $('input[name=name]','#form2').val('Hello World!'); est traduit, en interne, par jQuery pour $('#form2').find('input[name=name]').val('Hello World!') (voir: jQuery API pour les détails.)
    • Vous avez oublié les guillemets dans le nom de la partie Avec, je les reçois une erreur de syntaxe
    InformationsquelleAutor tawfekov
  3. 5

    Je préfère un id sélecteur de descendant de votre #form2, comme ceci: 

    $("#form2 #name").val("Hello World!");

    http://api.jquery.com/descendant-selector/

    InformationsquelleAutor Marcos Sedrez
  4. 2

    Je sais que la question est à propos de la configuration d'une entrée, mais juste au cas où si vous souhaitez définir une zone de liste déroulante, puis (je recherche net pour elle et n'a rien trouvé et ce lieu semble un bon endroit pour guider les autres)

    Si vous aviez un formulaire avec l'ID de l'attribut (par exemple, frm1) et
    tu voulais un spécifique spécifique de la zone de liste déroulante, sans set ID mais le nom de l'attribut (par exemple, le district); ensuite utiliser

    JS:

    $("#frm1 select[name='district'] option[value='NWFP']").attr('selected', true);

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <form id="frm1">
        <select name="district">
            <option value="" disabled="" selected="" hidden="">Area ...</option>
            <option value="NWFP">NWFP</option>
            <option value="FATA">FATA</option>
        </select>
    </form>

    InformationsquelleAutor Adeel
  5. -2
    $("#name", '#form2').val("Hello World")
    InformationsquelleAutor bbbbb