在html页面

Question

<script>
var lname, fname;

function _(x){
return document.getElementById(x);
}
function process(x){

lname= $('input[name=lname]').val();
fname= $('input[name=fname]').val();

_("display_lname").innerHTML=lname;
 _("display_fename").innerHTML=fname;
}
</script>


<!--html-->

<input type="text" name="fname[0]">
<input type="text" name="lname[0]">
<input type="text" name="fname[1]">
<input type="text" name="lname[1]">
<!--and so on-->



Last Name: <span id="display_lname"></span>
First Name: <span id="display_fname"></span>

我希望for循环遍历它们并显示值。我试图实现它，但没有成功。我很乐意感谢你的帮助。

Answer 1

您似乎需要具有相同名称的所有输入的数据。您可以使用jQuery选择器$('input[name^=X]')查找名称以X和.each()函数开头的所有输入来处理它们。

HTML：

<input type="text" name="fname[0]" value="rrr"> <!-- VALUE ADDED -->
<input type="text" name="lname[0]" value="sss"> <!-- VALUE ADDED -->
<input type="text" name="fname[1]" value="ddd"> <!-- VALUE ADDED -->
<input type="text" name="lname[1]" value="eee"> <!-- VALUE ADDED -->

JS：

l_str = '';
$('input[name^=lname]').each(function() {
   l_str += $(this).val();
   l_str += ',';
});
$("#display_lname").html(l_str);

f_str = '';
$('input[name^=fname]').each(function(x) {
   f_str += $(this).val();
   f_str += ',';
});
$("#display_fname").html(f_str);

结果：

Last Name: sss,eee,
First Name: rrr,ddd,

JSFiddle

可以从class属性而不是name属性中进行选择。您可以将类添加到动态创建的输入中，并使用$(input.CLASSNAME)选择器。

JSFiddle

Answer 2

注意，name属性设置为fname和lname的元素不会显示在html。

您可以通过在传递给{{1}的属性选择器中引用name属性值来选择fname[0]属性值为lname[0]，name或其他属性的元素}，例如jQuery()

＆＃13;

＆＃13;

$('input[name="fname[0]"]')

＆＃13;

＆＃13;

＆＃13;