[单击单个元素时也会同时选择js并同时选中所有复选框

问题描述 投票:0回答:1

我正在使用此多个复选框插件http://multiple-select.wenzhixin.net.cn/docs/en/download

我正在使用过滤选项

我遇到的问题是,如果我只有一个选项,请选择全选,就像这张图片一样enter image description here

当我单击BERMUDA选项时,在调试时会同时onClick事件和onCheckAll事件,即使我不单击“全选”也是如此。

仅当我除了“全选”条目之外只有一个条目时,此事件才会发生。

js代码如下:

$("#" +ddl_ID).multipleSelect({
   filter: true,
   multiple: true,
   "data-multiple-width": 150,
   onClick: function (view) {
      //aggiungo alla lista di selezionati solo il valore selezionato.
      //se esiste già lo elimino

      listaSel = $("#"+txtSel_ID).val();

      var array = listaSel.replace("[", "").replace("]", "").split(",");
      const index = array.indexOf(view.value);
      if (index >= 0) //esiste già, lo elimino
         array.splice(index, 1);
      else //non esiste, lo aggiungo
         array.push(view.value);

      listaSel = "";
      //ricostruisco la stringa
      for (var i = 0; i < array.length; i++) {
         if (array[i] != "")
            listaSel += array[i] + ",";
      }

      if (listaSel.length > 0)
         listaSel = listaSel.substring(0, listaSel.length - 1);


      $("#" +txtSel_ID).val("[" + listaSel + "]");
      console.log($("#" +txtSel_ID).val());
   },
   onCheckAll: function (view) {

      listaSel = $("#" +txtSel_ID).val(); //attualmente nella ricerca

      var listaSelezionata = $("#" +ddl_ID).multipleSelect("getSelects"); //selezionati adesso
      var array = listaSel.replace("[", "").replace("]", "").split(",");

      for (var i = 0; i < listaSelezionata.length; i++) {
         const index = array.indexOf(listaSelezionata[i]);
         if (index == -1) //non esiste, lo aggiungo
            array.push(listaSelezionata[i]);
      }

      listaSel = "";
      //ricostruisco la stringa
      for (var i = 0; i < array.length; i++) {
         if (array[i] != "")
            listaSel += array[i] + ",";
      }

      if (listaSel.length > 0)
         listaSel = listaSel.substring(0, listaSel.length - 1);

      $("#" +txtSel_ID).val("[" + listaSel + "]");
      console.log($("#" +txtSel_ID).val());
   },
   onUncheckAll: function (view) {
      listaSel = $("#" +txtSel_ID).val(); //attualmente nella ricerca
      var listaSelezionata = $("#" +ddl_ID).find('option').not(':selected'); //selezionati adesso

      var array = listaSel.replace("[", "").replace("]", "").split(",");

      for (var i = 0; i < listaSelezionata.length; i++) {
         const index = array.indexOf(listaSelezionata[i].value);
         if (index > -1) // esiste, lo rimuovo
            array.splice(index, 1);
      }

      listaSel = "";
      //ricostruisco la stringa
      for (var i = 0; i < array.length; i++) {
         if (array[i] != "")
            listaSel += array[i] + ",";
      }


      if (listaSel.length > 0)
         listaSel = listaSel.substring(0, listaSel.length - 1);

      $("#" +txtSel_ID).val("[" + listaSel + "]");
      console.log($("#" +txtSel_ID).val());
   }
});

//se la listaSel è vuota richiamo per sicurezza l'uncheckall
if (listaSel == undefined || listaSel == "" || listaSel == "[]") {
   console.log("lista null");
   $("#" +ddl_ID).multipleSelect("uncheckAll");
}
//se no imposto i valori selezionati 
else {
   $("#" +ddl_ID).multipleSelect("setSelects", JSON.parse(listaSel));
 }
}

有人可以帮我吗?

javascript jquery multiple-select
1个回答
0
投票

我认为您所看到的行为是预期的行为(设计)。

如果选择多选中的唯一选项,则实际上已经选择了所有选项。因此它将通过勾选全选来表明您已经选择了所有选项。

您可以通过指定selectAll: false隐藏全选选项。

参考:http://multiple-select.wenzhixin.net.cn/examples#hide-select-all.html

© www.soinside.com 2019 - 2024. All rights reserved.