在 JQuery 上执行刷新以刷新选择选取器

Question

我有以下HTML代码，它可以选择多个带有实时选项的选项。我对jquery很陌生，如果选择了多个选项，我写了一个代码来刷新

<div class="col-sm">
<select id="dataPicker" class="selectpicker show-menu-arrow rule-options" multiple title="Rule Description" data-live-search="true" data-width="140px" data-size="5">
<option data-tokens="A"> A thru Column G </option>
<option data-tokens="B">B toC</option>
<option data-tokens="G">G to A</option>
</select>
</div>
<div class="container">
<div class = "row">
<div class="ml-auto p-1">
<button class="btn btn-dark " type="Validate">Run Validation</button>
<button class="btn btn-dark" id="myButton" type="Clear" >Clear Validation</button>
</div>
</div>
</div>
<script>
$('#myButton').on('click', function() {
$("#dataPicker").selectpicker("refresh");
})
</script>

Answer 1

一个简单而有效的解决方案是：

$('#myButton').on('click', function() {
$('#dataPicker').find('option').prop("selected", false);
})

您可以在 JSFiddle 上测试它：
http://jsfiddle.net/8e5agdpq/

我还读到jQuery版本之间存在许多兼容性问题。 在我的所有测试中都有效的一个残酷、不优雅和通用的解决方案也是：

$('#myButton').on('click', function() {
$('#dataPicker')
.find('option')
.remove()
.end()
.append('<option data-tokens="A"> A thru Column G </option>')
.append('<option data-tokens="B">B toC</option>')
.append('<option data-tokens="G">G to A</option>')
;
})

您可以在 JSFiddle 中测试它：
http://jsfiddle.net/koxs785a/