javascript - 动态添加新字段会重置先前字段中的值

Question

我使用 HTML/Javascript 组合来动态添加字段。

这是它的 jsfiddle:http://jsfiddle.net/kM9Yg/2/

我的问题是，如果我在字段中输入值，然后单击“添加更多”按钮，则会添加一个新字段，但之前字段的值会重置。

添加更多按钮的类型为 <input type="button"/>而不是<input type="reset" />

有什么办法可以防止这种情况发生吗？

Answer 1

使用 DOM 方法，而不是innerHTML。 DOM 方法是标准化的，innerHTML 不是。有些浏览器会将当前值反射(reflect)为默认值，而其他浏览器则不会。

你可以这样做:

var el, oEl = document.getElementById('divToClone');
if (oEl) {
  el = oEl.cloneNode(true);
  // code here to fix duplicate ids and
  // set style.display = '' so it's visible

  oEl.parentNode.appendChild(el);
}