Javascript isHidden函数要求我在应用响应显示时单击两次

我已经使用了一段时间的ishidden功能，它与我的网站工作良好

 <script>
function isHidden(oDiv){
  var vDiv = document.getElementById(oDiv);
  vDiv.style.display = (vDiv.style.display == 'none')?'block':'none';
}

.意见显示是我用来达到目的的课程，对于“显示和隐藏”部分效果很好

更新后的html代码如下所示

<div style="display: true;" style="cursor: hand;" onclick="isHidden('excerpt105')"><span class="opinion-title3">title</span></div><div id="excerpt105" style="display: true;"><span class="opinion-content">Here is a paragraph.</span></div>

<div style="display: true;" class="cursor: hand;" onclick="isHidden('excerpt105')"><span class="opinion-title3">title</span></div><div id="excerpt105" class="opinion-display"><span class="opinion-content">Here is a paragraph.</span></div>

标题是一个段落。 问题是，当页面大小小于768px且所有段落都被隐藏时，需要我在任何标题上单击两次以显示这些段落。这在我使用@media属性之前从未发生过

---

请帮助大家…

您删除了内联样式，因此

vDiv.style.display

第一次没有任何值

因此，当运行此代码时：

  vDiv.style.display = (vDiv.style.display == 'none')?'block':'none';  

对于第一次时间

显示

等于

未定义

，因此表达式的计算结果为

'none'

，当您单击第二次时间时，它最终为

'none'

，因此可以将其更改为

'block'

您可以在功能中执行以下操作：

 vDiv.style.display = (!vDiv.style.display || vDiv.style.display == 'none') ? 'block' : 'none';

也

显示：true是无效的css

编辑：上述解决方案只考虑元素的内联样式属性，该属性可能为空，元素的样式例如取自外部样式表。由于此空
样式。显示
不能与
显示：无
相同-当元素最初可见时，它将不起作用

为解决此问题，有必要检查元件：

  var vDiv = document.getElementById(oDiv);
  var elementStyle = window.getComputedStyle(vDiv);
  vDiv.style.display = (elementStyle.display == 'none') ? 'block' : 'none';

无效的css属性值

.opinion-tip-display {display: true;}
.opinion-display {display: true;}

应该是

.opinion-tip-display {display: block;}
.opinion-display {display: blcck;}

回答得好，请注意，此切换假定显示确实是
display:block
。默认情况下，div为
display:block
，但也可以设置为其他形式，因此最好创建两个函数，分别在显示为
block
和
inline block
时切换一次，等等……谢谢。当我应用您的代码时，情况发生了相反的变化：当页面大小低于768px（“css中的display:none”）时，它工作得很好，但当页面大小超过768px（“display:block”）时，需要两次单击。也许Narxx有必要创建两个函数？你能告诉我怎么做吗？
.opinion-tip-display {display: block;}
.opinion-display {display: blcck;}