jQuery循环在每个事件后追加结果

Question

我将jQuery中的每个循环与onchange()事件一起应用。

        $(function() {
         $('#datatype').change(function(){
            $.getJSON('/background_process', {
            }, function(data) {
        var toAppend = '';
       $.each(data.result,function(i,o){
       toAppend += '<option >'+o+'</option>';
      });
               $("#result").append(toAppend);
            });
            return false;
          });
        });

<select name="datatype" id='datatype'>
        <option selected disabled >SELECT DATATYPE</option>
        <option value="RAW">RAW</option>
        <option value="DEPTH">DEPTH</option>
</select>
<select id=result name="result">
       <option value="NULL">SELECT TOKEN</option>
</select>

因此，我的问题是，当我选择选项( "RAW“)时，它将返回结果作为选项值，然后选择”深度“选项，并添加”RAW“和”深度“返回结果，并给出两个数据作为选项。

输出-当我选择“原始”时

<option>"raw-result"<option>
<option>"raw-result"<option>

当我选择“深度”时

<option>"raw-data"<option>
<option>"raw-data"<option>
<option>"depth-data"<option>
<option>"depth-data"<option>

因此，当我选择选项时，它返回循环数据，当再次选择选项时，它返回新的循环数据，而不是在前面的select中追加数据。

输出应该是这样的--当我在“原始”选项之后选择“深度”选项时，它就会返回。

<option>"depth-data"<option>
<option>"depth-data"<option>

但是它没有返回这个结果。

Answer 1

您正在后面添加新数据，而不是用它替换旧的。使用append代替html

$("#result").html(toAppend);