Блог

У меня проблема с «остановкой» выполнения href любых ссылок. Итак, мой вопрос:

1) Возможно ли заменить href-элементы, которые генерируют внутренние ссылки (#), на любой компонент, возможно, <p> , <div> или <span> (или что-то еще, что могло бы работать), которые сохраняют то же поведение <a> элемента (наведение курсора, подчеркивание и т.д.), Но не выполняют какую-либо ссылку?

2) Альтернатива, «трюк», позволяющий избежать выполнения ссылок элементами href?

1 или 2, возможно, без использования jquery или любой другой библиотеки js

Спасибо за рандомизацию

Существуют всевозможные уловки, которые можно использовать для выполнения подобных действий, но чего вам нужно остерегаться, так это изменения поведения, отличного от того, которое пользователи привыкли ожидать от браузера. Например, можно было бы поменять местами значение кнопок «OK» и «Отмена», но это просто запутало бы пользователя. (Экстремальный пример, я знаю, но вы поняли идею)

Если бы вы могли предоставить дополнительную информацию о том, почему вы пытаетесь это сделать, возможно, есть лучший способ подойти к делу.

Вы можете либо добавить onclick атрибут к определенным <a> элементам:

  <a href="whatever" onclick="return false"></a>
  

Или измените href следующим образом:

  <a href="javascript:"></a>
  

Чтобы они выглядели как ссылки, без перенаправления браузера.

Если вместо этого у вас уже есть куча ссылок с href s, и вы просто хотите сделать их все без перенаправления, то следующий jQuery сделает это для всех ссылок на странице:

 $(function () {
    $('a').click(false);
});
  

Несмотря на то, что это красиво и коротко, вышеупомянутое работает только с jQuery-1.4.3 . Если вы используете более старую версию, то вы можете использовать расширенную форму:

 $(function () {
    $('a').click(function () { return false; });
});
  

ДА. Вы можете запретить ссылкам выполнять действие по умолчанию — рекомендуемый способ — заставить ссылки работать нормально (в случае, если JS отключен или недоступен — подумайте о «мобильных браузерах»), а затем переопределить действие по умолчанию с помощью JS.

К сожалению, из-за несовместимости между браузерами есть три способа сделать это («традиционный», «W3C» и «IE»), и вам нужны все они: stopPropagation() , cancelBubble и return false . Смотрите полный пример в QuirksMode:http://www.quirksmode.org/js/events_order.html#link9

(Кстати, большинство фреймворков JS абстрагируются от этого, поэтому в jQuery вы бы сделали это:

 $('a').click(function(event){
    // do something on click here
    event.preventDefault();
});
  

Это делает то же самое, что и пример QuirksMode, но это более простой для чтения пример.)

ЧТОБЫ отключить ссылку через js, добавьте onclick=»this.href=’javascript:void(0)’;» вот так:

 <a href="#" onclick="this.href='javascript:void(0)';">link text</a>
  

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

 <div onclick="this.href='http://www.mysite.com';"></div>
  

Это работает в IE, chrome и Firefox:

 <a href="javascript:functionX();">text link</a>
  

В функции возвращается значение void(0):

 function functionX() {
...
return void(0);
}