Question

我希望在选中复选框后显示文本。它完全没有我的复选框上的课程，但如果我在我的复选框上放一个课程，我就无法显示我的文本。我需要在我的复选框中添加样式。这是我的代码，我想知道为什么js会受到class属性的影响。

合同复选框已经过检查！

      <script>
           function myFunction() {
                   var checkBox = document.getElementById("myCheck");
                   var text = document.getElementById("text");
                        if (checkBox.checked == true){                                                                         
                           text.style.display = "block";                                                                    
                         } 
                        else {                                                                        
                           text.style.display = "none";                                                                      
                         }
                      }
             </script>

Answer 1

你没有一个id为“text”的元素，但是你试图在这里找到一个：

var text = document.getElementById("text");

您可以将其添加到段落元素中：即 <p id="text"> 但这也会导致你的复选框消失。

Answer 2

你的代码对我来说很合适。

＆＃13;

function myFunction() {
  var checkBox = document.getElementById("myCheck");
  var text = document.getElementById("text");
  if (checkBox.checked == true) {
    text.style.display = "block";
  } else {
    text.style.display = "none";
  }
}

＆＃13;

.flat {
  display: inline-block;
  width: 20px;
}

＆＃13;

<input type="checkbox" id="myCheck" class="flat" onclick="myFunction()">Contract
<p id="text" style="display:none">Checkbox is CHECKED!</p>

＆＃13;

Answer 3

如果您使用的是Firefox，请尝试添加“firebug”。它可以帮助您调试javascript或css中的问题。至少它过去曾多次帮助过我。链接在这里 - https://addons.mozilla.org/en-US/firefox/addon/firebug/

选中复选框后显示文本

3 个答案: