javascript - 更改选项的选定属性后强制选择刷新

Question

在一个旧项目中，我使用 jQuery v1.7.1 和 Chosen 0.9.8(更新到 0.9.10，但没有任何变化)。我有一些 SELECT，每个都有 21 个选项，每次用户单击复选框时，我都需要使用 JavaScript 选择/取消选择一些选项。我这样做了，并在检查页面时看到了更改。我没有看到 SELECT 中发生任何变化，就像触发器(“liszt:updated”)什么也不做。有什么想法吗？

这是 HTML(简化):

@for (int i = 0; i < Model.SoasEsitiLavori.Count(); i++)
          {
            SoaModel soa = Model.SoasEsitiLavori[i];

            <tr>
               <td>
                <select id="SoasEsitiLavori[@i]._RegioniEsiti" multiple="multiple" 
                        name="SoasEsitiLavori[@i]._RegioniEsiti"
                        class="regionilavori chzn-select" >
                  @foreach (XRegione reg in ViewBag.ElencoRegioni)
                  {
                    <option value="@reg.IDRegione">@reg.Regione</option>
                  }
                </select>
              </td>

            </tr>
          }

这是 Javascript(简化的):

function CheckRegioneClick(RegioneCheck) {

  var CurrentChecked = RegioneCheck.checked;
  var CurrentValue = RegioneCheck.value;

  //Extracts a list of "SELECT"
  var regioni = document.getElementsByClassName('regionilavori');

  for (z = 0; z < regioni.length; z++) {

      var r = regioni[z];
      var r1 = document.getElementById(r.id);
      var ao = r1.getElementsByTagName('option');

      for (var i = 0; i < ao.length; i++) {
        if (ao[i].value == CurrentValue) {
          ao[i].selected = CurrentChecked;

          //This SHOULD update the SELECT, but nothing happens
          $(r.id).trigger("liszt:updated");              
        }
      }    

      $(r.id).trigger("liszt:updated");
      $(r.id).val(CurrentValue).trigger("liszt:updated");

    }        
  }
}

如何强制刷新 SELECT？

Answer 1

您可以使用$('select').trigger('chosen:updated');

如需进一步引用，请检查 https://harvesthq.github.io/chosen/options.html