Div是在提交表格时创建的

Question

我是网络开发的新手，我目前正在制作旅行计划员。我有一个活动div，当您单击加号时，表单向下滑动以插入有关此活动的信息。基本上我想在每次用户点击提交时使用此表单中输入的信息创建一个div。我不知道这叫什么，或者如何实现，任何反馈都非常受欢迎。

Answer 1

你可以做的是创建一个函数来动态创建你想要显示给用户的元素，并在提交按钮的onClick处理程序上调用该函数。

这可能是这样的：

function create() {
    var parent = document.createElement('div');
    parent.className = 'parent';

    //you would have a child element for each bit of data the user has input
    var child = document.createElement('div');
    child.className = 'child';
    parent.appendChild(child);

    //append the newly created div to your container
    var container = document.getElementById('container');
    container.appendChild(parent);
}

然后将其添加到按钮onclick listener

var button = document.getElementById('button');
button.addEventListener('click', create);

如果同一个用户多次输入数据，这将具有多次调用的优势。

然而，如果只需要显示一次，你可以将所有内容都放在那里但不显示，并将其显示属性设置为'inline-block'而不是'none'

如果你想要，你可以使用CSS动画属性来滑动div（或任何你想要的动画）。

Answer 2

编写表单div的html代码。将其另存为变量

中的文本

(var html = "...") 

并使用jQuery

$("#divId").append(html)

Answer 3

＆＃13;

＆＃13;

function  createDiv(){
var i=1;
            var ele = document.createElement("div");
            ele.setAttribute("id","DivId"+i);
            ele.setAttribute("class","inner");
            ele.innerHTML="hi "+i;
            output.appendChild(ele);
		
		}

＆＃13;

<div id="output" class="out">

</div>
<input type="button" onclick="createDiv();" name="submit" >


       

＆＃13;

＆＃13;

＆＃13;