javascript - 如何在变量中获取 ClientID

Question

我在页面上有 7 个 7 周的复选框和 7 天的单独时间选择器。选中复选框后，我想显示该工作日的时间选择器，如果未选中，我想隐藏相应的时间选择器

我已经使用以下代码来获取它，它也能正常工作。

function Chk_WeekDay_Clicked(ctrl, week) {
    if (ctrl.checked) {
        if (week == "Monday")
            document.getElementById("<%= Tm_Monday_From.ClientID %>").style.display = "";
        else if (week == "Tuesday")
            document.getElementById("<%= Tm_Tuesday_From.ClientID %>").style.display = "";
        else if (week == "Wednesday")
            document.getElementById("<%= Tm_Wednesday_From.ClientID %>").style.display = "";
       //Rest of the days 
    }
    else{
        if (week == "Monday")
            document.getElementById("<%= Tm_Monday_From.ClientID %>").style.display = "none";
        else if (week == "Tuesday")
            document.getElementById("<%= Tm_Tuesday_From.ClientID %>").style.display = "none";
        else if (week == "Wednesday")
            document.getElementById("<%= Tm_Wednesday_From.ClientID %>").style.display = "none";
        //Rest of the days 
    }
}

Chk_WeekDay_Clicked 是所有工作日复选框的事件处理程序。第一个参数是 Clicked CheckBox 控件，第二个参数是星期几的名称。

所有时间选择器控件的名称都具有与 Tm_[WeekName]_From 相同的命名模式

所以，我的问题是，除了使用这么多 if-else 之外，我可以在几行中完成吗？类似下面的代码。

function Chk_WeekDay_Clicked(ctrl, week) {
    //I want this controlId by using parameter. And I must get it by ClientID as I am using it on page having MasterPage.
    var controlId = "Tm_" + week + "_From";
    if (ctrl.checked) {
        document.getElementById(controlId).style.display = "";
    }
    else {
        document.getElementById(controlId).style.display = "none";
        }
}

我的实际问题是如何在变量中获取控件的 ClientId。由于我的页面使用母版页，我必须使用 ClientID 来获取控件 ID。

所以，谁能提出解决方案

Answer 1

ClientID 由 ASP.NET 生成，不能使用 JavaScript 变量创建。但是你可以做这样的事情

function Chk_WeekDay_Clicked(ctrl, week) {

    //Since Client ID is generated by ASP.NET
    //Create a list of ids
    var controls  = {
        "monday" : "<%= Tm_Monday_From.ClientID %>",
        "tuesday" : "<%= Tm_Tuesday_From.ClientID %>",
        "wednesday" : "<%= Tm_Wednesday_From.ClientID %>",
    }

    //Fetch Control ID
    var controlId = controls[week.toLowerCase()];

    //Desired operation
    if (ctrl.checked) {
        document.getElementById(controlId).style.display = "";
    }
    else{
        document.getElementById(controlId).style.display = "none";
    }
}