javascript - 单击单个元素时多选js引发也checkall

Question

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

我正在使用过滤选项

我遇到的问题是，如果我只有一个选项，那就是像这张图片一样全选


当我单击 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));
 }
}

有人能帮我吗？

Answer 1

感觉像是插件的默认行为，但我们可以通过简单地查看您的问题来解决它，因为答案就在那里。您提到当多选框中只剩下一项时会出现此问题，对吗？好吧，这就是我们的暗示。
因此，您需要做的就是在长度仅等于 1 时设置一个条件来处理此问题。从你的代码来看，我相信我们可以通过这行代码得到总长度:

var listaSelezionata = $("#" +ddl_ID).multipleSelect("getSelects"); //selezionati adesso

我们将直接进入onCheckAll事件并添加一个条件，如果项目大于 1，则仅在 oncheckAll 中执行某些操作否则什么都不会发生。

onCheckAll: function (view) {
    var listaSelezionata = $("#" +ddl_ID).multipleSelect("getSelects"); //selezionati
    if(listaSelezionata.length > 1){
      //Do somthing
    }
}

希望能帮助到你 :)