jQuery的，加上输入元素

Question

我已经成功地将输入元素放入格，它看起来像这样：

$(document).ready(function() { 
    $('#jumlah').change(function() { 
var jum = $('#jumlah').val(); 

for(i=1;i<=jum; i++){ 
    $('#jawaban').append('<label>Jawaban Soal ' + i + ' : </label><input type="text" name="jawab'+i+'" id="jawab[]" size="2" maxlength="1" /><br>'); 
} 
    }); 
}); 

和我的一些HTML代码：

<select name="jumlah" id="jumlah" class="test"> 
    <option value="0" selected="selected">choose value</option> 
    <?php 
    for($i=1;$i<=20;$i++) 
    echo("<option value=\"$i\">$i</option>"); 
?> 
</select> 

<div id="jawaban"></div> 

，但是当我选择不同的价值，它会在第一个输入元素下添加更多输入元素，例如，如果我选择选项2，然后是选项3，它将如下所示：

Jawaban Soal 1 : <input /> 
Jawaban Soal 2 : <input /> 
Jawaban Soal 1 : <input /> 
Jawaban Soal 2 : <input /> 
Jawaban Soal 3 : <input /> 

请大家帮忙，我还是Jquery的小辈。我期待着您的回应。

Answer 1

我猜你想要旧的消失，在这种情况下，你应该首先emptyjawaban div。

$(document).ready(function() { 
    $('#jumlah').change(function() { 
    var jum = $('#jumlah').val(); 

    $('#jawaban').empty(); 

    for(i=1;i<=jum; i++){ 
     $('#jawaban').append('<label>Jawaban Soal ' + i + ' : </label><input type="text" name="jawab'+i+'" id="jawab[]" size="2" maxlength="1" /><br>'); 
    } 
    }); 
}); 

你（逸岸相当数量的人），应该缓存 jQuery的对象构建。每次在代码中使用$('someSelector')时，jQuery会重新选择您的元素，并且每次都会为您返回一个新对象。 这不是小事！

$(document).ready(function() { 
    $('#jumlah').change(function() { 
    var jum = +$('#jumlah').val(); // convert this to an integer (it's a string otherwise) 
    var jawaban = $('#jawaban').empty(); 

    for(var i=1;i<=jum; i++){ // don't forget to initialize i! 
     jawaban.append('<label>Jawaban Soal ' + i + ' : </label><input type="text" name="jawab'+i+'" id="jawab[]" size="2" maxlength="1" /><br />'); 
    } 
    }); 
});