切换 - 必须点击两次

Toggle - have to click two times

我有一个显示按钮的代码,单击按钮可以隐藏和显示复选框。现在的问题是,第一次单击时没有任何反应,按钮上的第二个时钟隐藏了 "div field"。

我该怎么做才能让第一次点击就可以正常工作?我怎样才能从一开始就隐藏 "div field" 并在单击时显示它?

<p>Click the button to trigger a function.</p>
            <p class="button" onclick="toggle()">Tennis</p>
            <div id='divSection'>
<div class="jrFieldDiv jrLeft">
  {jr_tennis_label}: {jr_tennis}
</div>


</div>

<script>
               function toggle(){
                   var div = document.getElementById("divSection");
                   if (div.style.display =='block'){
                       div.style.display = 'none';
                       return;
                   }
                   div.style.display ='block';
             }
 </script>

这只是因为在页面加载时您的 div 不包含显示中的块 属性。 因此,将您的 div 声明为:

<div id="divSection" style="display:block">