2010-11-27 63 views
53

是否有任何方式来填充某些形式的所有输入? 让的说,有些事情是这样的:jquery从特定形式获取所有输入

<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,名称,甚至动画那些输入元素

有没有什么办法呢?

请让我知道,并提前谢谢! 和

回答

124

要通过表单中所有的投入就可以做到这一点迭代:

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

它使用jQuery的:input selector让所有类型的输入,如果你只是想文本,你可以这样做:

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

+1

除了选择选项,这是工作吗? – AnD 2010-11-27 20:18:08

+3

我认为:输入的作品,但否则你可以这样做:`$(“form#formID input [type = text],form#formID select”)` – TJB 2010-11-27 21:29:41

16

下面的代码有助于与表单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()); 
    } 
); 
1

使用HTML表单“元素”属性:

$.each($("form").elements, function(){ console.log($(this)); }

现在没有必要提供这样的名称为“输入,文本区域,选择......”等等。