时间戳

首页 > 解决方案 > 阻止无不适用于javascript中的li元素

javascript - 阻止无不适用于javascript中的li元素

问题描述

我想<li>根据某些条件阻止、隐藏元素，所以我尝试了下面的代码。

if (document.getElementById('ContentPlaceHolder1_hndSubGroupName').value == "SLP State Head") {
  document.getElementById('addStore').style.display = "block";
  document.getElementById('deleteStore').style.display = "none";
} else if (document.getElementById('ContentPlaceHolder1_hndSubGroupName').value == "RRSOC Viewer") {
  document.getElementById('addStore').style.display = "none";
  document.getElementById('deleteStore').style.display = "none";
} else {
  document.getElementById('addStore').style.display = "block";
  document.getElementById('deleteStore').style.display = "block";
}
<input type="hidden" id="ContentPlaceHolder1_hndSubGroupName" value="RRSOC Viewer" />
<ul>
  <li id="addStore" class="" href="#" role="button">Add New Store</li>
  <li id="deleteStore" class="" href="#" role="button">Delete Store</li>
  <li class="" href="#" role="button" onclick="return DownloadAllStateReport();">Export Report</li>
  <li class="" role="button" onclick="return DownloadHelpManual();">Help Manual</li>
</ul>

标签： javascriptjqueryhtml

解决方案

我会回答这个问题，因为我已经发表了很多评论

在元素加载后执行脚本，将脚本放在元素之后或包装在 onload 处理程序中

代码可以简化：

var val   = document.getElementById('ContentPlaceHolder1_hndSubGroupName').value;
var slp   = val = "SLP State Head";
var rrsoc = val = "RRSOC Viewer";
document.getElementById('addStore').style.display = rrsoc ? "none":"block";
document.getElementById('deleteStore').style.display = !slp && !rrsoc ? "block": "none";
<input type="hidden" id="ContentPlaceHolder1_hndSubGroupName" value="RRSOC Viewer" />
<ul>
  <li id="addStore" class="" href="#" role="button">Add New Store</li>
  <li id="deleteStore" class="" href="#" role="button">Delete Store</li>
  <li class="" href="#" role="button" onclick="return DownloadAllStateReport();">Export Report</li>
  <li class="" role="button" onclick="return DownloadHelpManual();">Help Manual</li>
</ul>

推荐阅读