Onclick转到URL和内容类名更改

Question

当我在索引页面中单击红色时，IAM在仅移动网站上工作，它显示转到color.html并使用其ID更改其内容类名称。 当我单击其转到页面但不更改类名时。 请给我一个解决方案

 Index.html:
 <script type="text/javascript">  
  function redActive(){
   document.getElementById("red").className = "red active";
  }
  function blueActive(){
   document.getElementById("blue").className = "blue active";
  }
  function greenActive(){
   document.getElementById("green").className = "green active";
  }
</script>

<div class="navi">
   <ul>
      <li><a href="color.html" onclick="redActive();">Red</a></li>
      <li><a href="color.html" onclick="blueActive();">Blue</a></li>
      <li><a href="color.html" onclick="greenActive();">Green</a></li>
   </ul>
</div>

color.html:
<div id="red" class="red"></div>
<div id="blue" class="blue"></div>
<div id="green" class="green"></div>

.red.active, .blue.active, .green.active {
   display:block;
}

Answer 1

因为index.html JavaScript不能更改color.html className

尝试这个：

的index.html

<div class="navi">
   <ul>
      <li><a href="color.html?c=red" onclick="redActive();">Red</a></li>
      <li><a href="color.html?c=blue" onclick="blueActive();">Blue</a></li>
      <li><a href="color.html?c=green" onclick="greenActive();">Green</a></li>
   </ul>
</div>

color.html：

<script type="text/javascript">  
  window.onload = function(){
    var query = window.location.search.substring(1);
    var cid= query.split("=")[1];
    document.getElementById(cid).className = cid + " active";
  }
</script>

<div id="red" class="red"></div>
<div id="blue" class="blue"></div>
<div id="green" class="green"></div>