每次點擊按鈕添加新的div div

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

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>

來源

2017-02-12 Olekern

您可以利用html()覆蓋當前內容。使用append()增加這樣一個新問題：

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

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

來源

2017-02-12 22:50:04

這工作，但它造成了一個新問題。當我按下現在得到一個新問題時，它再次同時添加了以前的問題。因此，不僅僅是「問題3」，它也表示問題1和問題2。感謝所有幫助。 – Olekern

@ Olekern可以解釋更多嗎？你想追加什麼？ –

Okey，所以我追加了outputQuestion，但是當我下次再追加它時，它包含我上次追加的內容。那有意義嗎？ – Olekern

每次點擊按鈕添加新的div div

回答

相關問題