javascript - 追加值留在原地

Question

我正在通过 AJAX 将选项生成到选择中。这些选项会在选择另一个选择时添加。

第一个包含追加数据的函数:

    var appendto_c = function(appendto, value, curcode) {
    appendto.append("<option value=\"" + value.currency_value + "\">" + value.type + " " + curcode + value.currency_value + "</option>"); //set the option
    $(".currency_val").find(".select2-chosen").html(value.type + " " + curcode + value.currency_value); //set the placeholder
}

第二个函数执行 ajax 并根据将从主下拉列表中获取的货币 ID 附加到选择中:

var showcurval = function(cur_code) {
    var $options = $('.currency_v'); // the optgroup append to
    var $curcode = '';
    $.ajax({
       type: 'GET',
       url:  '/transactions/get_currency_val?cur_code=' + cur_code,
       success: function(data) {
           var obj = JSON.parse(data);
           $.each(obj, function (k, v) {
               switch (v.currency_code) {
                   case '47':
                       $curcode = '€';
                       appendto_c($options, v, $curcode);
                       break;
                   case '33':
                       $curcode = 'Kč';
                       appendto_c($options, v, $curcode);
                       break;
                   case '131':
                       $curcode = '₽';
                       appendto_c($options, v, $curcode);
                       break;
                   case '144':
                       $curcode = '$';
                       appendto_c($options, v, $curcode);
                       break;
                   case '168':
                       alert('Please set a currency!');
                       break;
               }
           });
       }
    });
}

最后一个函数负责将货币代码发送到 showcurval..

 var selectcurrency = function() {

    var $currency = $(".currency_input").select2(); // main input
    var $curval  = $('.currency_val').select2(); // secondary select with our values
    var $options = $('.currency_v'); // the optgroup append to

    $currency.on('change', function(e) {
       showcurval($(this).select2('data').id);
    });
}
selectcurrency();

JSON:

[{"currency_value":"26.98","currency_code":"47","type":"BUY"},{"currency_value":"25.98","currency_code":"47","type":"SELL"}]

现在，每次更改 selectcurrency(); 选项都会附加，但是选择其他货币时，旧货币会保留。我尝试使用 html 而不是追加，但选择中只出现 1 个选项。有什么建议吗？

Answer 1

您应该在附加值之前清空 $options。

var showcurval = function(cur_code) {
    var $options = $('.currency_v'); // the optgroup append to
    var $curcode = '';
    $.ajax({
       type: 'GET',
       url:  '/transactions/get_currency_val?cur_code=' + cur_code,
       success: function(data) {
           var obj = JSON.parse(data);
           $options.html("");
           $.each(obj, function (k, v) {
               switch (v.currency_code) {
                   case '47':
                       $curcode = '€';
                       appendto_c($options, v, $curcode);
                       break;
                   case '33':
                       $curcode = 'Kč';
                       appendto_c($options, v, $curcode);
                       break;
                   case '131':
                       $curcode = '₽';
                       appendto_c($options, v, $curcode);
                       break;
                   case '144':
                       $curcode = '$';
                       appendto_c($options, v, $curcode);
                       break;
                   case '168':
                       alert('Please set a currency!');
                       break;
               }
           });
       }
    });
}