jquery如何获取表单元素类型、名称和值答案

【问题标题】：jquery how to get form element types, names and valuesjquery如何获取表单元素类型、名称和值
【发布时间】：2011-08-05 16:54:37
【问题描述】：

我知道我可以通过使用来获得名称/值关系

$(#form).serializeArray();

但是有没有一种方法可以通过一次调用获得整个 enchilada、类型、名称和值？

【问题讨论】：

标签： jquery forms elements

【解决方案1】：

使用$("form :input")

根据docs：

描述：选择所有输入， textarea，选择和按钮元素。

现在回答你的问题，

有办法获得整体 enchilada，类型，名称和值一个电话？

如果你只是想遍历项目，

$("form :input").each(function(index, elm){
  //Do something amazing...
});

但是如果你想返回某种结构，你可以使用.map()

var items = $("form :input").map(function(index, elm) {
    return {name: elm.name, type:elm.type, value: $(elm).val()};
});

或者如果你只是想获取元素

$("form :input").get()

Example of this on jsfiddle

【讨论】：

是的，如果您还想检索提交按钮，这是最好的方法。

【解决方案2】：

以下代码有助于从具有表单 id 的特定表单中获取元素的详细信息，

$('#formId input, #formId select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

下面的代码有助于从加载页面中的所有表单中获取元素的详细信息，

$('form input, form select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

下面的代码有助于获取放置在加载页面中的元素的详细信息，即使元素没有放在标签内，

$('input, select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

注意：我们在对象列表中添加我们需要的更多元素标签名称，如下所示，

Example: to get name of attribute "fieldset",

$('input, select, fieldset').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

【讨论】：

【解决方案3】：

您能否遍历表单的每个input 元素并使用从那里获得的数据？像这样的：

$('form input').each(function(i, v) {
    // Access like this:
    //   $(this).attr('type');
    //   $(this).attr('value');
    //   $(this).attr('name');
});

【讨论】：

我只是在阅读 .each 和 .map 以查看它们是否有帮助。 : D /n/n 我知道我可以通过这种方式获取所有输入，但是 select 和 textareas 呢？
你可以修改选择器以使用form input, form select, form textarea
编程中的最佳实践是说明每个变量的作用。由于大多数 IDE 现在都具有自动完成功能，因此无需使用字母变量。代替i 使用index 代替v 使用value
呃，是的，如果我想让自己和所有这些都变得轻松的话，我可以...：D 我在这里处于森林和树木模式，缺少明显的东西...
既然可以使用.val()，为什么还要选择值作为属性？

【解决方案4】：

要获取所有表单元素，请使用

$('input, textarea, select').each(function() {
    //   $(this).attr('type');
    //   $(this).attr('name');
    //   $(this).val();
});

【讨论】：

这就是我要找的。为我更好的代码优化而优雅而简单地保存它。亲爱的@Bot你太棒了:-)

【解决方案5】：

也许children() 会更有用，但您仍然需要自己过滤感兴趣的元素，除非您使用选择器。

如果您只想选择表单中的successful 元素，也可以执行以下操作；这将不包括按钮或禁用的字段。

$($('#testf').serializeArray()).each(function(index, value){
    $('#testf [name="' + value.name + '"]'); //select the named element
});

马克的回答似乎是最好的方法，IMO。

【讨论】：

这将包括作为孩子列在表单标签内的任何 HTML。
jostster 说了什么，然后我得到了所有标签、
标签以及

中没有的内容
@jostster 我知道，这就是 children() 所做的，但我可能应该澄清一下 - 我已经更新了我的答案。谢谢