2 yvonne221 Yvonne221 于 2016.03.20 20:40 提问

js表单内如何动态添加元素

已经在form内动态添加了一个div,该div中包含一个button,我希望点击button之后,这个div中动态添加一个text。但是点击完button之后,页面就自动刷新所有元素消失不见?请问各位大神是什么原因??
代码如下:
function add(){
var form = document.getElementById("form");

var div = document.createElement("div");
    div.style.border = "1px #CCC";
    div.style.borderStyle = "dashed";
    div.style.width = "200px";
    div.style.height = "200px";

var button = document.createElement("button");
    button.innerHTML = "再添加";      
    button.addEventListener(onclick, function() {
        var text = document.createElement("input");
            text.type = "text";  
            div.appendChild(text);                      
    })
    div.appendChild(button);

 form.appendChild(div);   
}

2个回答

devmiao
devmiao   Ds   Rxr 2016.03.20 22:42
wolalawo
wolalawo   2016.03.21 15:13

function add(){
var form = document.getElementById("form");
var div = document.createElement("div");
div.style.border = "1px #CCC";
div.style.borderStyle = "dashed";
div.style.width = "200px";
div.style.height = "200px";
form.appendChild(div);

    var button = document.createElement("input");
    button.type = "button"
    button.value = "再添加";  
    button.addEventListener("click",function(){
        var text = document.createElement("input");
            text.type = "text";  
            div.appendChild(text);
    })

    div.appendChild(button);
    form.appendChild(div);   
}
add();
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!