检查单选按钮后如何从url中移除锚？

Question

当我单击单选按钮时，我需要从url或非目标元素中移除一个锚。

下面是代码，当我单击第一页的链接时，我希望控制第二页上的特定元素(例如更改字体颜色)，但我所面临的问题是，在我从单选按钮列表中选择了某物之后，我不能通过使用css“取消目标”，同时也有两个链接突出显示。

第一页：

<a href="oferta.html">OFERTA</a>

<ul>
  <li><a href="oferta.html#webdesign">webdesign</a></li>
  <li><a href="oferta.html#grafika">grafika</a></li>
  <li><a href="oferta.html#kampania">kampania</a></li>
</ul>

第二页：

<style type="text/css">
  *{
    clear: both;
  }
  label:target{
    color: red;
  }
  #webdesign:target ~ #wd, #grafika:target ~ #gr, #kampania:target ~ #kp{
    visibility: visible;
    z-index: 10;
  }
  input[type=radio]:checked + #webdesign, input[type=radio]:checked + #grafika, input[type=radio]:checked + #kampania{
    color: red;
  }
  input[type=radio]:checked + #webdesign ~ #wd, input[type=radio]:checked + #grafika ~ #gr, input[type=radio]:checked + #kampania ~ #kp{
    visibility: visible;
    z-index: 100;
  }
  #wd, #gr, #kp{
    width: 500px;
    height: 100px;
    visibility: hidden;
    position: absolute;
    z-index: 0;
  }
  #wd{
    background: red;
  }
  #gr{
    background: green;
  }
  #kp{
    background: blue;
  }
</style>

<a href="home.html">HOME</a>


<input type="radio" id="webdesign1" name="labels">
<label for="webdesign1" id="webdesign">webdesign</label>

<input type="radio" id="grafika1" name="labels">
<label for="grafika1" id="grafika">grafika</label>

<input type="radio" id="kampania1" name="labels">
<label for="kampania1" id="kampania">kampania</label>


<div id="wd"></div>
<div id="gr"></div>
<div id="kp"></div>

Answer 1

这很简单。附加任何广播的第一个change事件，而不是从hash中删除hash部件。

假设您使用的是jQuery：

$('input:radio').one('change', function(){
  location.hash = '';
});

http://jsbin.com/wesotoh/edit?html,js