jQuery添加表单输入并更改输入名称

Question

我正在为婚礼摄影师构建订单,因此客人可以从他网站的客户专辑部分订购图片.

客人订购1到50张图片,所以我目前正在使用jQuery的clone()功能,这非常有用.

但是我还需要更改每个输入的名称attr,每次添加一个,以便表​​单处理可以获取新输入.

name="picture-1"
add field
name="picture-2"

有谁知道这是否可能？

我相信我addClass()每次都可以使用clone()它,但我怎么能addClass()算数呢？

谢谢

Answer 1

您只需设置name克隆元素的属性即可.(在jQuery 1.6或更高版本上使用prop; attr在1.5.2及更低版本上.看起来attr在1.5和1.6上工作; prop 也适用于1.6及更高版本.)

但请注意,HTML表单的工作方式,可以有多个具有相同名称的字段,它们都被发送到服务器,您的代码可以处理所有这些(通常是您正在使用的服务器端技术设置它们)作为数组或列表).

例:

HTML:

<form id='theForm'>
  <input type='text' name='picture-1'>
  <input type='button' id='btnMore' value='+'>
</form>

使用jQuery的JavaScript:

$('#btnMore').click(function() {
  var form, fields, newField;

  form = $("#theForm");
  fields = form.find("input[name^='picture-']");
  newField = $(fields[0]).clone();
  newField.attr('name', 'picture-' + (fields.length + 1));
  newField.insertAfter(fields.last());
});

实时复制