JQuery 选择设置在更改事件时选择的最大选项数

如何解决JQuery 选择设置在更改事件时选择的最大选项数

我正在使用 Jquery Chosen 插件，我想动态设置用户可以在另一个选定选择的更改事件上选择的最大选项数。注意：里程碑选择控件是一个多选

这是我的代码，

const $milestone = $('#mainmodallg .modal-body form select[name="milestone"]');
$('#mainmodallg .modal-body form select[name="item_code"]').change( function () {
   $milestone.chosen({ max_selected_options: 1 });
   $milestone.trigger("chosen:updated");
});

现在它没有改变它。我错过了什么？

解决方法

您需要获取所选选择的实例，然后使用该实例更新您的 max_selected_options 值。

演示代码：

$(".chosen-select").chosen({
  width: "95%"
});
const $milestone = $('select[name="milestone"]');
$('select[name="item_code"]').change(function() {
  $milestone.data('chosen').max_selected_options = 1; //get instance
  $milestone.trigger("chosen:updated"); //update
  //or
  //destroy plugin & re-intialize
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.min.css" integrity="sha512-yVvxUQV0QESBt1SyZbNJMAwyKvFTLMyXSyBHDO4BG5t7k/Lw34tyqlSDlKIrIENIzCl+RVUNjmCPG+V/GMesRw==" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js" integrity="sha512-rMGGF4wg1R73ehtnxXBt5mbUfN9JUJwbk21KMlnLZDJh7BkPmeovBuddZCENJddHYYMkCh9hPFnPmS9sspki8g==" crossorigin="anonymous"></script>
<select data-placeholder="Choose..." class="chosen-select" name="item_code">
  <option value=""></option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>
<select data-placeholder="Choose..." class="chosen-select" multiple="" name="milestone">
  <option value=""></option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>