下拉与复选框不起作用

Drop down with checked box not working

本文关键字：不起作用 复选框      更新时间：2023-09-26
<!DOCTYPE html>
<html lang="en">
<head>
</head>
    <title>test App</title>
    <!-- Bootstrap Core CSS -->
    <link href="/Project/static/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom CSS -->
    <link href="/Project/static/css/sb-admin.css" rel="stylesheet">
    <link href="/Project/static/css/bootstrap-multiselect.css" rel="stylesheet">
    <!-- Custom Fonts -->
    <link href="/Project/static/lib/css/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <script src="/Project/static/lib/js/jquery.min.js"></script>
<body>
<div >
        <ul id="ts" class="collapse">
            <select id="time-stamp" multiple="multiple">
                <option value="T1">T1</option>
                <option value="T2">T2</option>
                <option value="T3">T3</option>
                <option value="T4">T4</option>
                <option value="T5">T5</option>
            </select>
        </ul>
        <ul id="cs" class="collapse">
            <select id="chart-select" onchange="fillChart()">
                 <option value="error_info">select</option>
                 <option value="session_history">Error Info</option>
            </select>
        </ul>
</div>
<script src="/Project/static/js/jquery.js"></script>
<script src="/Project/static/js/bootstrap.min.js"></script>
<script src="/Project/static/js/bootstrap-multiselect.js"></script>
<script type="text/javascript">
        function fillChart()
        {
            var chkd = document.getElementById("time-stamp");
            var cids = [];
            for (var i=0;i<chkd.length;i++)
            {
                alert(i);
                if(chkd[i].checked)
                {
                    cids.push(chkd[i]);
                }
            }
            alert(cids);
        }
</script>
</body>
</html>

我正试图读取选中的复选框的所有字段的文本。但是，alert(cids)在这里是零。chkd[i].checked总是返回false，因为cids.push(chkd[i])没有执行。我能知道我错在哪里吗?

您必须检查属性selected而不是checked:

请换

if(chkd[i].checked)


if(chkd[i].selected)

请同时查看option元素的文档

您需要检查selected而不是checked属性。请看下面的代码片段:

function fillChart() {
  var chkd = document.getElementById("time-stamp");
  var cids = [];
  for (var i = 0; i < chkd.length; i++) {
    //alert(i);
    if (chkd[i].selected) {
      cids.push(chkd[i].value);
    }
  }
  console.log(cids);
}
<select id="time-stamp" multiple="multiple">
  <option value="T1">T1</option>
  <option value="T2">T2</option>
  <option value="T3">T3</option>
  <option value="T4">T4</option>
  <option value="T5">T5</option>
</select>
<select id="chart-select" onchange="fillChart()">
  <option value="error_info">select</option>
  <option value="session_history">Error Info</option>
</select>

相关文章：