提问人：Vasil 提问时间：10/6/2008 最后编辑：CommunityVasil 更新时间：12/3/2009 访问量：10624
使用jQuery使用关联数组中的数据填充表单
Populate a form with data from an associative array with jQuery
问：
上次我问了反向过程，得到了一些非常有效的答案。我的目标是在这里使用最少的代码行。我有一种形式的字段和一个 {fieldname：data} 格式的关联数组，我想用它填充相应的形式。
答：
11赞
Adam Bellaire
10/6/2008
#1
如果表单元素的 ID 设置为字段名称：
$.each(myAssocArry, function(i,val) { $('#'+i).val(val); });
评论
0赞
Pentium10
6/15/2011
这接缝错过了复选框。它不会检查它们，而是更改为它们定义的值。
5赞
Eran Galperin
10/6/2008
#2
或者类似于前面的建议，使用字段名称而不是 ids：
$.each(data, function(name,value) {
$("input[name='" + name + "']").val(value);
});
评论
0赞
nickf
10/6/2008
很好的答案，但这不会选择框或文本区域。也许将“input[name=...]”更改为“*[name=...]”？另外，我刚刚修复了代码中的语法错误。
0赞
Eran Galperin
10/7/2008
我不确定“*”是否有效，如果有效，它可能会有些密集。您可以添加其他用逗号分隔的选项 - $（“input[name...]，select[name...]，textarea[name...]）。瓦尔。。。
0赞
Jacob Mattison
1/13/2009
你可以执行 $（“：input[name=...”），它应该选择和文本区域（注意冒号）。
7赞
J5.
10/6/2008
#3
当我为一个项目执行此操作时，我发现设置选择字段、单选按钮和复选框的值需要更复杂的代码，大致如下：
jQuery.each(data, function (name,value) {
jQuery("input[name='"+name+"'],select[name='"+name+"']").each(function() {
switch (this.nodeName.toLowerCase()) {
case "input":
switch (this.type) {
case "radio":
case "checkbox":
if (this.value==value) { jQuery(this).click(); }
break;
default:
jQuery(this).val(value);
break;
}
break;
case "select":
jQuery("option",this).each(function(){
if (this.value==value) { this.selected=true; }
});
break;
}
});
});
我还没有测试过这段代码，所以我希望没有我应该发现的愚蠢的语法错误。希望这会有所帮助。
我（还）不允许对这里的评论发表评论，所以.... 如注释中所述，jQuery .val（val） 方法处理设置单选按钮、复选框和选择。
你仍然需要将 select[name=...] 放入 jQuery 选择器模式中，否则 select 元素将不会更新。
评论
3赞
nickf
10/6/2008
看一下 val（） 函数。我相信它会为您处理所有这些案件。
0赞
gaborous
11/20/2014
工作正常，但实际上 val（） 函数确实处理了 select 和其他类型，因此您不必使用开关，在所有情况下简单的 jQuery（this）.val（value） 就足够了。
1赞
Brian Franklin
12/3/2009
#4
我还没有看到jQuery处理将单个（非数组）值传递到val（）中以进行单选或复选框输入。您必须确保将单个值包装到数组中。
我通常也不想改变按钮式输入的值，所以我过滤掉了这些值。
下面是一个函数，用于处理数组包装、按钮筛选，并将输入选择限制为给定的表单元素。form 参数是可选的。如果保留 off/null/undefined，则将选择页面上的所有输入。
function populateForm(data, form) {
$.each( data, function(name, value) {
var input = $(":input[name='" + name + "']:not(:button,:reset,:submit,:image)", form );
input.val( ( !$.isArray( value ) && ( input.is(':checkbox') || input.is(':radio') ) ) ? [ value ] : value );
} );
};
评论