克隆表单内容、更改属性、附加到 jQuery 或普通 JS 中的表单

Question

我正在努力实现上述目标 - 我已尽我所能，但代码根本无法执行。

$('.container').on('click', 'form', function() {
  var clone = $('form').clone();
  clone.find('input').attr('name', 'pick0' + length);
  $('form').appendChild(clone);
});

html + codepen 上的 js 例子 https://codepen.io/anon/pen/KQrEMd

编辑：

正在尝试根据对表单的点击来复制表单。 1 次点击 = 1 个额外表格。

Answer 1

尝试

$('.container').on('click', 'form', function() {
    if(typeof($('form').data('length')=='undefined')){
       var $length = 1;
    }else{
      var $length = parseInt($('form').data('length'));
    }
  var clone = $('form').clone();
  clone.find('input').attr('name', 'pick0' + $length);
  $('form').append(clone.html());
  $('form').data('length',$length+1);
});

});

Answer 2

如果我正确理解你的问题，也许这会有所帮助

$('.container').on('submit', 'form', function(e) {
  e.preventDefault();
  console.log(e.target.pick0.value);
  var input = e.target.pick0.cloneNode(true);
  document.getElementsByClassName('container')[0].appendChild(input);
});

Answer 3

尝试使用此代码：

$('.container').on('click', 'form', function() {
  var clone = $('form:last').clone();
  length = $('form').length;
  clone.find('input').attr('name', 'pick' + length);
  $('.container').append(clone);
});

克隆表单内容、更改属性、附加到 jQuery 或普通 JS 中的表单

Clone form contents, change attribute, append to form in jQuery or vanilla JS

javascript

jquery

clone