每次單擊按鈕時添加新 div

Question

我正在嘗試創建一個頁面，用戶可以在其中創建一個問題表單，他們可以在其中自行添加問題並更改他們想要提出的問題類型。 與 Google 表單幾乎相同。 根據問題的類型，創建的問題下方應出現一個框。 當我嘗試這樣做時，該框僅出現在最后一個問題上，因此我相信每次添加新問題時它都會被覆蓋。 關於如何在每個問題下方創建框的任何提示？

 function createQuest() { number++; chooseTime(); outputQuestion += '<div id="question' + number + '>'; outputQuestion += '<p id="k"></p>'; outputQuestion += '<h2>Question' + number + '</h2>'; outputQuestion += '<form name="choose">'; outputQuestion += '<textarea rows="1" cols="30" id="question' + number + '" name="text" placeholder="Question"></textarea>'; outputQuestion += '<select id="sel' + number + '">'; outputQuestion += '<option id="' + number + '" id="TEXT" onclick()>Text</option>'; outputQuestion += '<option id="' + number + '" id="SLIDER">Rating</option>'; outputQuestion += '</select>'; outputQuestion += '<ul id="list-quest' + number + '">'; outputQuestion += '</ul>'; outputQuestion += '</form>'; outputQuestion += '</div>'; $("#list-create-doc").html(outputQuestion); textChosen(number); } var outputQuest1 = ""; function textChosen(nr) { outputQuest1 = ""; outputQuest1 += '<div class="textbox" id="txt">'; outputQuest1 += '<textarea rows="1" cols="30" placeholder="Answered with text"></textarea>'; outputQuest1 += '</div>'; var whereAdd = "#list-quest" + nr; console.log(whereAdd); $(whereAdd).html(outputQuest1); }

 <button id="btn" onclick="createQuest()">Legg til spørsmål</button>

Answer 1

您正在使用html()覆蓋當前內容。 使用append()添加一個新的，如下所示：

$("#list-create-doc").append(outputQuestion);

這是jQuery.append和jQuery.html的文檔！