Jquery 选择2在选择后显示不同的值

我试图找到这个问题的最新答案，因为Select2的formatSelection选项似乎不再有效，或者根本不适用于我

基本上，我有一个multi-select Select2菜单，希望在选择后显示选项的值，而不是文本描述。例如，我有一个省份列表，其中每个省份都有一个缩写作为选项AB（阿尔伯塔省）的值，BC（不列颠哥伦比亚省）的值，等等。这些是我希望在被选中后显示的省份。在Select2 4.0.0中有没有一种简单的方法可以做到这一点

标记：

<select id="provSelect" multiple data-role="none" >

</select>

具有适当的功能：

function formatSelection(item){
         return item.id;
}

---

Select2仍然有一个格式化API，现在称为模板。例如：

function formatState (state) {
    if (!state.id) { return state.text; }
    var $state = $(
        '<span><img src="vendor/images/flags/' + state.element.value.toLowerCase() + '.png" class="img-flag" /> ' + state.text + '</span>'
    );
    return $state;
};

$(".js-example-templating").select2({
    templateSelection: formatState
});

---

您可以使用不同的模板设置结果和选择；文档。

可在此处找到模板选择->或查看以下示例：

    function formatState (state) {
  if (!state.id) {
    return state.text;
  }

  var baseUrl = "/user/pages/images/flags";
  var $state = $(
    '<span><img class="img-flag" /> <span></span></span>'
  );

  // Use .text() instead of HTML string concatenation to avoid script injection issues
  $state.find("span").text(state.text);
  $state.find("img").attr("src", baseUrl + "/" + state.element.value.toLowerCase() + ".png");

  return $state;
};

$(".js-example-templating").select2({
  templateSelection: formatState
});

---

嗯，我觉得没什么可展示的。我动态添加文本文件中的项目，使标记为空。我已经更新了我的帖子。出于我的目的，我不得不使用templateSelection选项而不是templateResult，但这达到了我的目的：谢谢你为我指明了正确的方向。@mbassett没问题，很高兴我能帮上忙！

    function formatState (state) {
  if (!state.id) {
    return state.text;
  }

  var baseUrl = "/user/pages/images/flags";
  var $state = $(
    '<span><img class="img-flag" /> <span></span></span>'
  );

  // Use .text() instead of HTML string concatenation to avoid script injection issues
  $state.find("span").text(state.text);
  $state.find("img").attr("src", baseUrl + "/" + state.element.value.toLowerCase() + ".png");

  return $state;
};

$(".js-example-templating").select2({
  templateSelection: formatState
});