JQuery 已选择将更改事件的最大选项数设置为 select

Question

我正在使用 Jquery Chosen 插件，我想动态设置用户在另一个选择 select 的更改事件中可以 select 的最大选项数。注意：milestoneselect控件是一个multiselect

这是我的代码，

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");
});

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

Answer 1

您需要获取所选 select 的实例，然后使用该实例更新您的 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>

JQuery 已选择将更改事件的最大选项数设置为 select

JQuery Chosen set maximum number of options to select on change event

javascript

jquery

jquery-chosen