onclick必须被点击两次才能开火

Question

除非点击两次,否则我的onclick功能不会触发.我是javascript的新手,但到目前为止,我在var obj行中移动,并将=="none"更改为"none"？"empty"; 哪些都是我不理解的东西,但看到其他人都解决了这个问题.都没有奏效.

<a href="#" onClick="showDiv('show1')">+</a>

function showDiv(id){
var obj = document.getElementById(id);
if( obj.style.display == "none") {
obj.style.display='block'
}
else{
obj.style.display='none'    
}
}


<div id="show1">
Roughly 2-3 months.
</div>

Answer 1

您的问题是,您style直接使用元素的属性.假设您未obj.style.display = "none";明确设置代码,则值将保持undefined到第一次单击为止.第一次点击后,它被设置,一切都像你想要的那样.

要解决它,请使用getComputedStyle()访问元素的样式.这包括通过CSS设置的所有样式:

function showDiv(id){
  var obj = document.getElementById(id),
      compStyle = window.getComputedStyle( obj );
  if( compStyle.display == "none") {
    obj.style.display='block'
  } else {
    obj.style.display='none'    
  }
}