jquery – 使用Ajax时清除select2下拉列表的正确方法是什么？

看起来清除SELEct2的正确方法是您最初建议的this answer建议.

使用Javascript

$(document).ready(function() {
  $("#Streamname").SELEct2();
  $("#Streamname").val(null).trigger("change");
});

HTML

<SELEct id="Streamname">
  <option value="AL">Alabama</option>
  <option value="CA">California</option>
  <option value="WY">Wyoming</option>
</SELEct>

更新 – 远程数据源

JSFiddle Using Remote Data

即使使用远程数据源,这仍然可以清除SELEct2输入：

$("#Streamname").val(null).trigger("change");

完整的Javascript

$(document).ready(function() {
  $("#Streamname").SELEct2({
    ajax: {
      url: "https://api.github.com/search/repositories",dataType: 'json',delay: 250,data: function(params) {
        return {
          q: params.term,// search term
          page: params.page
        };
      },processResults: function(data,params) {
        // parse the results into the format expected by SELEct2
        // since we are using custom formatTing functions we do not need to
        // alter the remote JSON data,except to inDicate that infinite
        // scrolling can be used
        params.page = params.page || 1;

        return {
          results: data.items,pagination: {
            more: (params.page * 30) < data.@R_393_10586@l_count
          }
        };
      },cache: true
    },escapeMarkup: function(markup) {
      return markup;
    },// let our custom formatter work
    minimumInputLength: 1,templateResult: formatRepo,// omitted for brevity,see the source of this page
    templateSELEction: formatRepoSELEction // omitted for brevity,see the source of this page
  });


  $("#Streamname").val(null).trigger("change");

  // For tesTing...
  $('#set-null').click(function() {
    $("#Streamname").val(null).trigger("change");
  });



});


function formatRepo(repo) {
  if (repo.loading) return repo.text;

  var markup = "<div class='SELEct2-result-repository clearfix'>" +
    "<div class='SELEct2-result-repository__avatar'><img src='" + repo.owner.avatar_url + "' /></div>" +
    "<div class='SELEct2-result-repository__Meta'>" +
    "<div class='SELEct2-result-repository__title'>" + repo.full_name + "</div>";

  if (repo.description) {
    markup += "<div class='SELEct2-result-repository__description'>" + repo.description + "</div>";
  }

  markup += "<div class='SELEct2-result-repository__statistics'>" +
    "<div class='SELEct2-result-repository__forks'><i class='fa fa-flash'></i> " + repo.forks_count + " Forks</div>" +
    "<div class='SELEct2-result-repository__stargazers'><i class='fa fa-star'></i> " + repo.stargazers_count + " Stars</div>" +
    "<div class='SELEct2-result-repository__watchers'><i class='fa fa-eye'></i> " + repo.watchers_count + " Watchers</div>" +
    "</div>" +
    "</div></div>";

  return markup;
}

function formatRepoSELEction(repo) {
  return repo.full_name || repo.text;
}

HTML

<SELEct id="Streamname">
  <option value="3620194" SELEcted="SELEcted">SELEct2/SELEct2</option>
</SELEct>