GetElementById Returns 未定义值

Question

我有一个 CheckboxList 有 3 个选项。

在我的 javascript 中，我想检查勾选了哪些选项。

但是验证没有通过，因为检索到的 var 值为 undefined。

javascript: 编辑

var schedule = document.getElementById("<%=ddlExecutionSchedule.ClientID%>").value; 
// ^ return as undefined

var schedule2 = document.getElementById("ddlExecutionSchedule").value;
// ^ return as undefined

var scheduleOptions = schedule.getElementsByTagName('input'); 
// ^ error: Uncaught TypeError: Cannot read property 'getElementsByTagName' of undefined

html:

<div class="form-group" id="divExecutionSchedule">
<label class="control-label col-md-2" id="lblExecutionSchedule">Execution Schedule</label>
<div class="col-md-3">
    <div class="input-group">
        <asp:CheckboxList ID="ddlExecutionSchedule" ClientIDMode="Static" CssClass="chkLabel" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table" onchange="ToggleExecutionSchedule(this)" >
            <asp:ListItem Text="Daily" Value="Daily"></asp:ListItem>
            <asp:ListItem Text="Weekly" Value="Weekly"></asp:ListItem>
            <asp:ListItem Text="Monthly" Value="Monthly"></asp:ListItem>
        </asp:CheckboxList>
    </div>
</div>

c#:

//if (ddlExecutionSchedule.Text == "Weekly") // <= Commented off to allow catering for multiple checkboxes to be ticked at the same time
    //{
    string selectedDay = item["Days"] != null ? item["Days"].ToString() : string.Empty;

    if (!string.IsNullOrEmpty(selectedDay))
    {
        List<string> day = selectedDay.Replace(";#",";").Split(';').ToList();
        for (int i = 0; i < chkSelectDay.Items.Count; i++)
        {
            if (day.Contains(chkSelectDay.Items[i].Value))
            {
                //Check only if they match! 
                chkSelectDay.Items[i].Selected = true;
            }
        }
    }
//}

我看过类似的文章，也试过几种方法，包括加入GetElementsByTagName，但是打Uncaught TypeError。

非常感谢任何帮助。

Answer 1

它正在返回 undefined，因为复选框列表的容器没有任何值，所以，

您需要遍历 CheckBox 列表以获取选中的值，例如：

编辑：因为你指定了ClientIDMode="Static"所以它不会在运行时改变所以你可以直接指定容器的ID

        //var chkBox = document.getElementById('<%= ddlExecutionSchedule.ClientID %>');
        var chkBox = document.getElementById('ddlExecutionSchedule');
        var options = chkBox.getElementsByTagName('input');
        var listOfSpans = chkBox.getElementsByTagName('span'); //change 'span' as per the page structure
        for (var i = 0; i < options.length; i++)
        {
            if(options[i].checked)
            {
                alert(listOfSpans[i].attributes["JSvalue"].value); //change attribute as per the page structure
            }
        }

Answer 2

你能不能试着去掉双引号，即在 js 中 "<%=ddlExecutionSchedule.ClientID%>" 周围的 "" 而只保留 (<%=ddlExecutionSchedule.ClientID%>)。

这可能对你有帮助

Answer 3

请从下面的代码中删除 ClientIDMode="Static"。

<asp:CheckboxList ID="ddlExecutionSchedule" CssClass="chkLabel" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table" onchange="ToggleExecutionSchedule(this)" >
    <asp:ListItem Text="Daily" Value="Daily"></asp:ListItem>
    <asp:ListItem Text="Weekly" Value="Weekly"></asp:ListItem>
    <asp:ListItem Text="Monthly" Value="Monthly"></asp:ListItem>
</asp:CheckboxList>

或者如果你想继续 ClientIDMode="Static" 然后编写 JS 语法如下。

var schedule = document.getElementById("ddlExecutionSchedule").value;

这可能对您有所帮助。

GetElementById Returns 未定义值

GetElementById Returns Undefined Value

html

javascript

c#

checkboxlist

visual-studio