Question

有一个函数hideLabels应保存所选标签的当前值，然后在取消选中该复选框后（在检查一次之后）将其返回。控制台说："Uncaught TypeError: Cannot read property 'innerHTML' of null "但我仍然无法看到错误的位置。

<script>

 function hideLabels(labelname) {

    var labelInitial=document.getElementById(labelname).innerHTML ;
    if (document.f.test.checked==true) {
        document.getElementById(labelname).innerHTML="";
    } else {
        document.getElementById(labelname).innerHTML=labelInitial;
    } };

function hideComments() {

    hideLabels(label_1) ;
    if (document.f.test.checked==true) {
        document.f.s.style.display="none";
    } else {
        document.f.s.style.display="inline";
    } };

</script>

<FORM name=f >

<label ID="label_1" for="s">Select please!</label>

<SELECT NAME=s>
    <OPTION>First Option</OPTION>
    <OPTION>Second Option</OPTION>
    <OPTION>Third Option</OPTION>
</SELECT>
<BR>

<INPUT name="test" TYPE=checkbox VALUE="test" onChange="hideComments()";>
<INPUT type=button value="Alert" onClick="alert(document.getElementById('label_1').innerHTML)";>

</FORM>

Answer 1

你必须在hideLabels（）函数中用参数包装参数，因为该参数是作为字符串传递的。

<强>更新

我希望你只是尝试理解基础知识，因为我不明白你为什么不隐藏那个标签和<select>元素一样。或者将它们包装在一个div中，而不仅仅是切换div的可见性。这使你的工作变得轻松。

但这是你的工作方式，你应该在改变时获得初始html，而不是工作。

这是您的DEMO。

这就是我如何做到的，DEMO

<script>
    function hideComments() {
        var selectDiv = document.getElementById("toggleDiv");
        selectDiv.style.display = (selectDiv.style.display == "none") ? "block" : "none";
    };
</script>
<form name="f">
    <div id="toggleDiv">
        <label ID="label_1" for="s">Select please!</label>
        <select name="s">
            <option>First Option</option>
            <option>Second Option</option>
            <option>Third Option</option>
        </select>
    </div>
    <br/>
    <input name="test" type="checkbox" value="test" onchange="hideComments()" ;>
    <input type="button" value="Alert" onclick="alert(document.getElementById('label_1').innerHTML)" ;>
</form>

未捕获的TypeError：取消选中复选框时无法读取null的属性'innerHTML'

1 个答案: