2009-10-25 6 views
189

у меня есть этот HTMLJQuery найти родительскую форму

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

Как я могу выбрать форму, что input[name="submitButton"] является частью? (когда я нажимаю на кнопку отправки я хочу, чтобы выбрать форму и добавить несколько полей в нем)

ответ

437

Я предложил бы использовать closest, который выбирает ближайший соответствующий родительский элемент:

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

Вместо фильтрации по имени, я хотел бы сделать это:

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

Спасибо большое! Я действительно боролся с этим. –

+2

Может быть, мы должны добавить получение по индексу? '$ ("Вход [тип = представить]") ближайший ("форма");'. возвращает массив форм. – sergzach

+0

Я пытаюсь использовать вышеизложенное следующим образом: $ (". Each img"). Click (function() { $ (this) .closest ("form"). Show(); }); Но я не могу заставить его работать. :/ – Alisso

52

Вы можете использовать ссылку на форму, которая существует на всех входах, это намного быстрее, чем .closest() (в 5-10 раз быстрее в Chrome и IE8). Работает на IE6 & 7 тоже.

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

Вы упомянули IE8. Это работает и для версий 6, 7 и 9? – Sonny

+1

Это намного лучше и быстрее, чем упомянул @peterjwest. Re IE6 Я думаю, что .form на входных элементах был на IE4, к сожалению, страница netscape dev ушла сейчас ... и кто бы проверить mozilla один. –

+0

Это гораздо безопаснее, чем использование 'ближайшее()', поскольку вход может иметь собственное назначение формы: http://codepen.io/anon/pen/vNqEyg –

12

Для меня это выглядит как самый простой/быстрый:

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

Для меня использование '$ (this.form)' является лучшим решением – jap1968

Смежные вопросы