2009-10-25 19 views
189

ho questo htmljQuery trovare form padre

<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 la forma che il input[name="submitButton"] fa parte? (quando clicco sul pulsante di invio voglio selezionare il modulo e aggiungere alcuni campi in esso)

risposta

437

Io suggerirei di usare closest, che seleziona il più vicino elemento corrispondente genitore:

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

Invece di filtraggio dal nome, farei questo:

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

Grazie mille! Ero davvero alle prese con questo. –

+2

Possiamo aggiungere aggiungendo per indice? '$ ("Input [type = submit]") ("forma") più vicino;.' restituisce una matrice di moduli. – sergzach

+0

Sto cercando di utilizzare quanto sopra in questo modo: $ (". Each img"). Click (function() { $ (this) .closest ("form"). Show(); }); Ma non riesco a farlo funzionare. :/ – Alisso

52

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

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

Hai menzionato IE8. Funziona anche per le versioni 6, 7 e 9? – Sonny

+1

Questo è molto meglio e più veloce come citato da @peterjwest. Re IE6 Penso che .form sugli elementi di input fosse su IE4, sfortunatamente la pagina di sviluppo di netscape non c'è più ... e chi controllerebbe mozilla one. –

+0

Questo è un modo molto più sicuro piuttosto che usare 'closest()' dal momento che un input può avere un proprio assegnamento di modulo: http://codepen.io/anon/pen/vNqEyg –

12

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

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

Per me, usare '$ (this.form)' è la soluzione migliore – jap1968

Problemi correlati