jquery从特定表单获取所有输入

Question

有没有办法填充某些形式的所有输入？比方说,有些事情是这样的:

<form id="unique00">
  <input type="text" name="whatever" id="whatever" value="whatever" />
  <div>
    <input type="checkbox" name="whatever" id="whatever" value="whatever" />
  </div>
  <table><tr><td>
    <input type="hidden" name="whatever" id="whatever" value="whatever" />
    <input type="submit" value="qweqsac" />
  </td></tr></table>
</form>
<form id="unique01">
  <div>
    <input type="text" name="whatever" id="whatever" value="whatever" />
    <input type="checkbox" name="whatever" id="whatever" value="whatever" />
  </div>
  <table><tr><td>
    <input type="hidden" name="whatever" id="whatever" value="whatever" />
  </td></tr></table>
  <select>blah...</select>
  <input type="submit" value="qweqsac" />
</form>
etc forms... forms...

*注意:每个表单可能有不同的输入和类型,也有不同的html结构

那么有没有办法填充某些表单ID的输入？例如,如果我单击某个表单ID的提交按钮,那么jquery将为我填充那些表单id中的所有输入.目前我正在做的是这样的:

$("form").submit(function(){ return validateForm($(this)) });
function validateForm(form){
var retVal = true;
var re;
$.each(form.serializeArray(), function(i, field) {
  var input = $('input[name='+field.name+']');
  field.value = $.trim(field.value);
  switch(field.name){
    case "name" :
        and another cases...
      }
    })
 }

这是工作,但在这种情况下,我只获得field.name和field.value,实际上我想要的是,我想为每个输入元素一个jquery对象,所以我可以访问他们的CSS,ID,名称和甚至动画那些输入元素

这有什么办法吗？

请让我知道并提前感谢你!和

Answer 1

要遍历表单中的所有输入,您可以执行以下操作:

$("form#formID :input").each(function(){
 var input = $(this); // This is the jquery object of the input, do what you will
});

这使用jquery :input选择器来获取所有类型的输入,如果你只想要文本,你可以这样做:

$("form#formID input[type=text]")//...

等等

Answer 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 "textarea",

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