jQuery ссылка для проверки

1) У нас есть страница index.html с блоками:

<body>
<div id="action1">One</div>
<div id="action2">Two</div>
<div id="action3">Three</div>
</body>

2) CSS

body div { color: blue; }
body div.current { font-weight: bold; color: red; }

3) Другие страницы со ссылками на index.html и некоторые цели:

<a href="index.html#action1">Link to One</a><br/>
<a href="index.html#action2">Link to Two</a><br/>
<a href="index.html#action3">Link to Three</a><br/>

Вопрос заключается в том, как поймать текущую цель ссылки на странице index.html и присвоить дополнительный класс целевому блоку.

Если текущая ссылка открытой страницы index.html#action1, то добавить класс .current к <div id="action1">One</div>- станет <div id="action1" class="current">One</div>

If index.html#action2-> <div id="action2" class="current">Two</div>

И так далее.

  • проверьте #target
  • проверить id
  • if target = id addClass("current") для блока с id

Спасибо.


person Happy    schedule 11.06.2010    source источник


Ответы (1)


Ты можешь сделать это:

$(function() {
  if(location.hash) $(location.hash).addClass("current");
});

Здесь используется свойство hash местоположения (если оно есть), оно будет "#action1" в качестве селектора идентификаторов, а затем добавляет класс через .addClass(), коротко и просто :)

person Nick Craver    schedule 11.06.2010
comment
жарко убрать # из значения? - person Happy; 11.06.2010
comment
@Happy - вы бы не хотели этого, если бы использовали его в качестве селектора, вы хотите этот префикс #. Если вам нужно значение для чего-то еще, просто вызовите location.hash.replace('#','') - person Nick Craver; 11.06.2010