javascript - 使用 javascript 的动态显示/隐藏 div 不起作用

Question

我有一个基本的显示/隐藏 javascript 可以工作，只要我不让它动态化并确保参数。如果有人能帮我弄清楚为什么动态版本不起作用，我将不胜感激。

工作代码:
javascript

function togglesDiv(){  
  var catdiv = document.getElementById("addNewCat");  
  if(catdiv.style.display == ""){  
    catdiv.style.display = "none";  
  } else {  
    catdiv.style.display = "";  
  }  
}  

html

<span onclick="togglesDiv();">Add new category</span>  
<div id="addNewCat" style="display: none;">  
lalala  
</div>

非工作代码:
javascript

function togglesDiv(divsId){  
  var catdiv = document.getElementById("divsId");
  if(catdiv.style.display == ""){  
    catdiv.style.display = "none";  
  } else {  
    catdiv.style.display = "";  
  }  
}  

html

<span onclick="togglesDiv(addNewCat);">Add new category</span>  
<div id="addNewCat" style="display: none;">  
lalala  
</div>

Answer 1

您有一个用字符串定界符包裹的变量名，使其成为字符串文字而不是变量。改变

var catdiv = document.getElementById("divsId");

到

var catdiv = document.getElementById(divsId);

另一方面，对函数的调用需要在它的参数中使用引号(因为它应该是一个字符串)，您可以使用单引号来避免冲突:

<span onclick="togglesDiv('addNewCat');">Add new category</span>