jQuery trova il modulo principale

ho questo html

<ul>
    <li><form action="#" name="formName"></li>
    <li><input type="text" name="someName" /></li>
    <li><input type="text" name="someOtherName" /></li>
    <li><input type="submit" name="submitButton" value="send"></li>
    <li></form></li>
</ul>

Come posso selezionare il modulo di cui input[name="submitButton"]fa parte? (quando faccio clic sul pulsante di invio voglio selezionare il modulo e aggiungere alcuni campi in esso)

Suggerirei di utilizzare closest, che seleziona l'elemento genitore corrispondente più vicino:

$('input[name="submitButton"]').closest("form");

Invece di filtrare in base al nome, farei questo:

$('input[type=submit]').closest("form");

Puoi utilizzare il riferimento al modulo che esiste su tutti gli input, questo è molto più veloce di .closest()(5-10 volte più veloce in Chrome e IE8). Funziona anche su IE6 e 7.

var input = $('input[type=submit]');
var form = input.length > 0 ? $(input[0].form) : $();

Per me, questo sembra il più semplice / veloce:

$('form input[type=submit]').click(function() { // attach the listener to your button
   var yourWantedObjectIsHere = $(this.form);   // use the native JS object with `this`
});

A partire dai browser HTML5 si può usare inputElement.form: il valore dell'attributo deve essere un id di un <form>elemento nello stesso documento. Maggiori informazioni su MDN .

vedi anche jquery / js - Come faccio a selezionare il modulo principale in base al pulsante di invio selezionato?

$('form#myform1').submit(function(e){
     e.preventDefault(); //Prevent the normal submission action
     var form = this;
     // ... Handle form submission
});