动态显示/隐藏div与JavaScript无法正常工作

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>