Question

您好我正在开发一个asp.net应用程序。我有一个列表框，其中包含数据库中的某些值。在列表框中，我有带复选框的项目并选择所有选项。它基本上是mutiselect列表框。我可以显示在警告框中选择的项目数。如果我选中所有我能够使用长度属性显示项目数。每当我取消选中all all选项时我想显示0，因为所有复选框都将被取消选中。我试过很多方面仍然没有用。这是我的代码。这些是参考文献。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css"
    rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css" />
<script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js" type="text/javascript"></script>

以下是我的javascript代码

$(function () {
          $('[id*=ddlvendors]').multiselect({
              includeSelectAllOption: true
          });
      });

这是我从列表框中查找所选项目的代码。

 $(".limitedNumbSelect2 option").each(function () {
                var val = $(this).val();
                var tempVal = $(".limitedNumbSelect2").val();

                if (tempVal.indexOf(val) >= 0 && selected.indexOf(val) < 0) {
                    selected.push(val);
                } else if (tempVal.indexOf(val) < 0 && selected.indexOf(val) >= 0) {
                    selected.splice(selected.indexOf(val), 1);
                }
            })
            alert(selected.length);

每当我取消选中时，我的所有警报都不会被激发。我可以就此提出一些建议吗？谢谢大家。

Answer 1

我使用vanilla JS的解决方案是简单地听取change-event，如果输入有target.checked，则触发neccassary代码：https://jsfiddle.net/67dnnhva/

var allCheckboxes = document.querySelectorAll(".allcheckboxes input");
var checkAllElement = document.querySelector("#chkall");

checkAllElement.addEventListener("change", toggleSelectAll);

function toggleSelectAll(input) {
    if (input.target.checked) {
    allCheckboxes.forEach(function(input) {
        input.checked = true;
    });
  } else {
    allCheckboxes.forEach(function(input) {
      input.checked = false;
    });
    alert("hello");
  }
}

如何检查列表框项是否被选中？

1 个答案: