如何在检查单选按钮后从URL中删除锚点?

时间:2016-11-09 16:44:28

标签: javascript html css

我需要从网址中删除一个锚点,或者#34; untarget"当我点击单选按钮时的元素。

这里是代码,当我点击第一页上的链接时,我希望控制第二页上的特定元素(例如更改字体颜色),但我正在努力解决的问题是我可以& #39; t" untarget"通过使用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>

1 个答案:

答案 0 :(得分:1)

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

假设您使用的是jQuery:

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

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