jQuery - 使用bootstrap时不会触发更改

Question

我有一个计算器在我的选择中使用Bootstrap以及此扩展程序：http://silviomoreto.github.io/bootstrap-select/

我在选项中有不同的文字，但价值可能与它代表所选项目的价格相同。

<select>
  <option value="0">Red</option>
  <option value="0.23">Green</option>
  <option value="0.23">Blue</option>
</select>

我的问题是，当值相同时，jQuery不会触发change事件。如果值不同，它可以正常工作。我以为我可以创建自己的eventlistener，测试文本字符串，但我该怎么做？或者有没有人有更好的主意？

Answer 1

您可以使用的工作方式是使用数据属性。将您的选择更改为类似下面的内容

<select>
  <option data-value="0" value='Red'>Red</option>
  <option data-value="0.23" value='Green'>Green</option>
  <option data-value="0.23" value='Blue'>Blue</option>
</select>

然后绑定到更改

$('select').on('change', function(){
    var val = $(this).data('value');
});

这样，触发了change事件，你只需要通过data属性获取值。

Answer 2

你可以绑定到'blur'事件来检查select失去焦点时的值（如果它们点击它就会发生 - 给它焦点 - 然后再点击其他地方（或标签，和标签） ））。