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

Question

我使用 onchange() 事件在 jQuery 中应用每个循环。

        $(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”)时它返回结果作为选项值，然后我选择“DEPTH”选项并添加“RAW”和“DEPTH”返回结果并将两个数据作为选项。

输出 - 当我选择“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>

所以我想，当我选择选项时它返回循环数据，当再次选择选项时它返回新的循环数据而不是在之前的选择中附加数据。

输出应该是这样的——当我在“RAW”选项之后选择“DEPTH”选项时，它会返回

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

但它不会返回那个结果。

Answer 1

您正在附加新数据而不是替换旧数据。而不是 append 使用 html

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