templateResult 显示为多个项目选择的 true答案

【问题标题】：templateResult showing selected true for multiple itemstemplateResult 显示为多个项目选择的 true
【发布时间】：2015-07-10 19:31:26
【问题描述】：

我正在使用 jquery-select2 (4.0.0)。问题是当我选择一个选项，然后选择另一个选项时，item.selected 对于两个选项都保持正确 - 永远。是否有一些我缺少的初始配置选项或者这是一个错误？

function formatResult(item) {
  console.log("item selected = ", item.selected);
  return item.text;
}

$('select').select2({
  templateResult: formatResult,
  minimumResultsForSearch: Infinity,
  placeholder: "Please choose",
  multiple: false,
  maximumSelectionSize: 1
});

<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.js"></script>

<select>
  <option></option>
  <option>conan</option>
  <option>kimmel</option>
  <option>stewart</option>
  <option>colbert</option>
</select>

【问题讨论】：

标签： jquery-select2 jquery-select2-4

【解决方案1】：

我应该首先说item.selected（数据对象的selected 属性）没有记录，并且将在未来发生变化。为什么我说它会？因为这个错误只发生在单个选择元素上（如最后所述），但您现在可以放心地忽略它。

目前 item.selected 属性仅由 Select2 用于 <input /> 元素，item.element.selected 属性用于 <select> 元素。当使用<select> 元素时，这将始终成为您的真实来源，因为item.element 是对<option> 元素的引用，您的浏览器使用该元素来确定应将哪些数据发送到服务器.

您可以在查看后查看item.element.selected，在选择更改时正确更新。

function formatResult(item) {
  console.log("item selected = ", item.selected);
  console.log("item.element.selected = ", item.element && item.element.selected);
  return item.text;
}

$('select').select2({
  templateResult: formatResult,
  minimumResultsForSearch: Infinity,
  placeholder: "Please choose",
  multiple: false,
  maximumSelectionSize: 1
});

<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.js"></script>

<select>
  <option></option>
  <option>conan</option>
  <option>kimmel</option>
  <option>stewart</option>
  <option>colbert</option>
</select>

是的，item.selected 属性将在未来得到修复，因此它是准确的。现在它没有更新，因为在一次选择中，新选项被选中，而那些隐式取消选择旧选项。这与多重选择不同，其中选项被明确选择和取消选择。

【讨论】：