Javascript：如果用户请求，可以多次添加相同的表单

我正在建立一个网站，用户可以创建一个调查。我希望能够做到的一件事是，允许用户为他们想要的每个调查创建尽可能多的问题。我计划这样做的方式是在html页面上创建一个基本表单，然后使用javascript创建一个add按钮，当用户反复按下“add question”（添加问题）按钮时，该按钮将一次又一次地添加表单

---

我该怎么做呢？

实现这一点的方法有很多，我会给你举个例子。您将需要：

• 一连串的问题
• 添加新问题的按钮
• 问题模板

要在HTML中动态呈现问题数组，可以使用类似Handlebar的模板库

这里有一个快速的丑陋的例子来说明这一点：

//创建一系列问题
var q=[]；
q、 推送（{文本：'}）；
//创建一个模板来呈现您的问题
//在这个例子中，我使用把手
var source=document.getElementById（“问题模板”）.innerHTML；
var template=handlebar.compile（源代码）；
var-context={questions:q}；
函数renderTemplate（）{
var html=模板（上下文）；
document.getElementById（'questions-placeholder'）。innerHTML=html；
}
//使用第一个问题呈现模板
renderTemplate（）；
//添加事件，以便用户单击按钮时添加新问题
document.getElementById（“newquestion”）.addEventListener（'click'，function（））{
//添加新问题
q、 推送（{文本：}）；
//重新呈现模板
renderTemplate（）；
});

问题
{{{每个问题}
写下你的问题
{{/每个}}
添加问题
你走了多远？@Callam我不知道如何开始。我目前的想法是在加载页面时对表单进行一个常量，该页面是隐藏的，然后当按下按钮时，会出现此表单的新实例，但我不知道如何执行。非常感谢您的回复。我已经试过了，但是每次用户单击AddQuestion时，他们输入的所有信息都会被清除。如何停止此操作？对于第一个示例，要保留输入的信息，需要进行某种数据绑定。例如，使用angularJS很容易做到这一点。但是为了简单起见，我使用jQuery编写了第二个示例。