jQuery получить значение из объекта формы?

Question

У меня есть следующий вид:

<form> 
    <input type="radio" name="foo" value="1" checked="checked" /> 
    <input type="radio" name="foo" value="0" /> 
    <input name="this" value="xxx" /> 
    <select name="bar"> 
    <option value="hi" selected="selected">Hi</option> 
    <option value="ho">Ho</option> 
    </select> 
    <a class="js-add" href="#" >Add</a> 
</form> 

У меня есть следующая функция, которая проходит всю форму, когда связь добавить кнопки:

$(".js-add").click(function (e) { 
    e.preventDefault(); 

    values = getFormValues($("form")); 
}); 

getFormValues = function($form) { 
    var bar = $form.bar.val(); 

} 

Как получить конкретное значение входного сигнала от формы объект. Так, например, в приведенной выше функции getFormValues я хочу захватить значение поля ввода строки, но указанное выше не работает. Обычно я просто делал это: $bar.val(); Но как мне получить то же самое от объекта формы?

Answer 1

Что вы передаете в свою функцию, это не объект формы, это объект jQuery, который обернут вокруг объекта HTMLFormElement. API JQuery позволяет вам легко найти элементы внутри этого элемента с помощью find (один из tree traversal methods):

$form.find("[name=bar]").val() 

Затем вам нужно возвращение это значение из вашей функции, так:

return $form.find("[name=bar]").val(); 

Если имя не является допустимым идентификатором CSS (это в вашем примере, но ...), используйте его вокруг:

return $form.find("[name='bar']").val(); 

---

Это довольно легко с родной DOM, а также, но вы используете JQuery, так что ...