Javascript动态添加文本框值

我是javascript的新手。我想在运行时动态添加多个文本框.. Javascript动态添加文本框值

 <script type="text/javascript"> 
      function ajax(){ 
       var x = document.getElementById("ajax").innerHTML; 
       x= x + '<input name="reference[]" type="text" />'; 
       document.getElementById("ajax").innerHTML = x; 
      } 
     </script>

这是一个上单击事件。在这里，我的问题是每次添加一个新的文本框时，我以前的文本框的值就会消失，并且每次调用该函数时，所有文本框都将为空。

来源

2011-10-11 ravi404

尽管HTML5的最小尝试以规范的innerHTML，它是跨浏览器不一致，特别是有关属性和特性。不要将它用于非平凡的目的。 – RobG

我会建议使用document.createElement和document.appendChild

Example

function ajax() { 
    var textBox = document.createElement('input'); 
    textBox.name = 'reference[]'; 
    textBox.type = 'text'; 
    document.getElementById("ajax").appendChild(textBox); 
}

来源

2011-10-11 10:14:10

是啊这是正确的方式添加元素页面...不要追加一些HTML文本字符串 – Gatekeeper

谢谢Sahil ..它的工作.. – ravi404

附加到现有的内容不是覆盖它

附加：

document.getElementById("ajax").innerHTML += x;

覆盖

document.getElementById("ajax").innerHTML = x;

使用此

<script type="text/javascript"> 
      function ajax(){ 
       var x = '<input name="reference[]" type="text" />'; 
       document.getElementById("ajax").innerHTML += x; 
      } 
</script>

来源

2011-10-11 10:09:11 hungryMind

有同样的问题哥们。 – ravi404

DOM不建议两个元素使用相同的名称。但使用JQuery，（改变参考[]引用）你可以通过选择器$（“＃reference”）获取值。如果你想在服务器端使用这些值，你正在使用哪种语言？ – hungryMind

我正在使用PHP .. – ravi404

Javascript动态添加文本框值

回答

相关问题