加载“剃刀”页面时，如何使用JavaScript读取切换开关（复选框）的选中状态

Question

我有一个带有Bootstrap 4.3.1拨动开关复选框的Razor页面。它绑定到“剃刀页面模型”并且工作正常。我还有一个javascript函数，可根据是否检查状态来更改标签。

我想做的就是在页面加载时将标签更改为正确的标签，以便检查/不检查。

我使用HTML.CheckBoxFor创建复选框的代码如下：

               <div class="form-group custom-switch">
                    @Html.CheckBoxFor(Model => Model.ExistingCase.Closed, new {@class= "custom-control-input", @onclick="caseClosed(this)" })
                    <label class="custom-control-label" id="lblCaseClosed" for="ExistingCase_Closed">Slide right to Close Case</label>
                </div>

这将创建如下的HTML页面输出：

                <div class="form-group custom-switch">
                    <input checked="checked" class="custom-control-input" data-val="true" data-val-required="The Closed field is required." id="ExistingCase_Closed" name="ExistingCase.Closed" onclick="caseClosed(this)" type="checkbox" value="true" />
                    <label class="custom-control-label" id="lblCaseClosed" for="ExistingCase_Closed">Slide right to Close Case</label>
                </div>

工作正常...

然后，我有一些Javascript被复选框的更改触发（切换），并根据复选框的状态更改了关联的标签文本“向右滑动以关闭大小写”（切换）。该脚本如下：

       function caseClosed(el) {
            document.getElementById('lblCaseClosed').innerHTML = el.checked ? "Case is Closed" : "Case is Open"
            }

这也很好。

我不能做的是，第一次加载页面时，标签文本显示为“ Case is Closed”或“ Case is Open”。我是Razor和Javascript的新手，所以我希望有一个简单的“ onload”类型事件，该事件可以读取切换开关（复选框）的“ checked”状态并在标签中设置正确的文本。

很抱歉，如果这个单词罗word但难以解释。这是我加载页面时拨动开关（复选框）的状态。但是另外两个是当我用鼠标更改页面上的状态时。

---

---

Answer 1

尝试将其添加到脚本中：

    window.onload = function() {
         caseClosed(document.getElementById('ExistingCase_Closed'));
    }