Список ссылок: Использование прослушивателей событий для упрощения структуры HTML - PullRequest
Новая
       13

Список ссылок: Использование прослушивателей событий для упрощения структуры HTML

0 голосов
/ 16 марта 2011

Сколько я себя помню, я делал следующее: 

<ul>
  <li><a href="somewhere">Some text</a></li>
</ul>

Поскольку это просто список ссылок, ничего больше, я знаю, что могу сделать это, чтобы упростить структуру: 

<ul>
  <li onclick="window.location.href='somewhere'">Some text</li>
</ul>

Я только что облегчил структуру HTML на 50%.Если бы у меня было 100 строк, у меня было бы 100 элементов вместо 200.

Конечно, я должен использовать прослушиватели событий вместо встроенного onclick, но я не знаю, как ... Как я могуиспользовать прослушиватели событий (вместо встроенных onclick) для создания списка ссылок?См. здесь для мотивации этого.

1 Ответ

2 голосов
/ 16 марта 2011

Если вы не возражаете против использования jQuery, вы можете взглянуть на базовые руководства по jQuery по привязке обработчиков кликов к элементам.Таким образом, вы можете установить onclick на все <li> сразу:

http://jsfiddle.net/7zba5/1/

HTML: 

<ul>
    <li data-url="http://www.google.com">Google</li>
    <li data-url="http://www.stackoverflow.com">Stack Overflow</li>
    <li data-url="http://www.superuser.com">Super User</li>
</ul>

JavaScript: 

$('li').click(function() {
    window.location.href = $(this).data('url');
});
...