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動態添加文本框值

回答

相關問題