jquery克隆功能不工作

Question

我想重複一個div，同時點擊一個按鈕。但是當我點擊按鈕的div出現，頁面刷新和div刪除。 這裏是我的JScript代碼：

$("#button").click(function() { 

     $('.duplicater').clone().insertAfter(".duplicater"); 

    }); 

這裏是我的html代碼

<div id="duplicater" class="duplicater"> 
The text goes here 
</div> 

<button id="button" class="btn btn-info btn-xs">Add More</button> 

如果用戶點擊的div似乎無需刷新頁面的按鈕，我想......

Answer 1

button行爲作爲提交，因爲它可能會做頁面提交，所以你可以嘗試改變你的按鈕標籤，從：

<button id="button" class="btn btn-info btn-xs">Add More</button> 

到

<input type="button" id="button" class="btn btn-info btn-xs" value="Add More" /> 

如果未指定任何按鈕標籤的類型是submit默認情況下，所以你也可以嘗試加式=「按鈕」爲：

<button type="button" id="button" class="btn btn-info btn-xs">Add More</button> 

Answer 2

剛纔檢查你的代碼上撥弄 Fiddle

它似乎工作正常。如果在加載按鈕元素之前加載了javascript，請在​​$（document）.ready（handler）中保留click事件;

$(document).ready(function(){ 
    $("#button").click(function() { 

     $('.duplicater').clone().insertAfter(".duplicater"); 

    }); 
});