javascript - Select2 从 中剥离所有属性

Question

我在我的 select 上使用 select2标签，当用户改变选择的选项时会有一些额外的。它使用了我设置为 data-price 的属性例如。 Select2 似乎正在剥离 <option> 中的所有属性除 value 之外的标签.

如何禁用此行为或如何以其他方式获取数据值？

编辑:我忘了补充一点，我也在使用 Sonata admin。 Sonata是默认加载select2的。

Answer 1

Select2 seems to be striping all attributes from the tags except for the value

不是真的 data-* 属性仍然存在，您只需获取它们即可:

$("#singleSelectExample").select2();

$('body').on('change', '#singleSelectExample', function(){
    console.log( $('#singleSelectExample option:selected').data('price') );
})

希望这对您有所帮助。

$("#singleSelectExample").select2();

$('body').on('change', '#singleSelectExample', function(){
  console.log( $('#singleSelectExample option:selected').data('price') );
})

.selectRow {
  display : block;
  padding : 20px;
}
.select2-container {
  width: 200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://select2.github.io/select2/select2-3.5.1/select2.js"></script>
<link href="https://select2.github.io/select2/select2-3.5.1/select2.css" rel="stylesheet"/>
<div class="selectRow">
  <select id="singleSelectExample">
    <option></option>
    <option value="1" data-price="111">Option 1</option>
    <option value="2" data-price="222">Option 2</option>
    <option value="3" data-price="333">Option 3</option>
  </select>
</div>