Как сделать так, чтобы тег привязки ссылался ни на что?

Question

Я использую jQuery, мне нужно, чтобы некоторые теги привязки не выполняли никаких действий.

Я обычно пишу это так:

<a href="#">link</a>

Однако это относится к началу страницы!

Answer 1

Есть несколько несовершенных решений:

1. Ссылка на фальшивый якорь

<a href="#">

Проблема: при нажатии на ссылку происходит возврат к началу страницы

2. Использование тега, отличного от 'a'

Используйте тег span и используйте jquery для обработки клика

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

3. Ссылка на функцию vavascript javascript

<a href="javascript:void(0);">
<a href="javascript:;">

Проблема: разрывы при связывании изображений в IE

Решение

Поскольку у них у всех есть свои проблемы, я остановился на решении, связанном с фальшивой привязкой, и затем возвратил false из метода onClick:

<a href="#" onClick="return false;">

Не самое лаконичное решение, но оно решает все проблемы с помощью вышеуказанных методов.

Answer 2

Если вы не хотите, чтобы он указывал на что-либо, вам, вероятно, не следует использовать тег <a> (якорь).

Если вы хотите, чтобы что-то было похоже на ссылку, но не действовало как ссылка, лучше использовать соответствующий элемент (например, <span>), а затем стилизовать его с помощью CSS:

<span class="fake-link" id="fake-link-1">Am I a link?</span>

.fake-link {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

Кроме того, учитывая, что вы пометили этот вопрос как "jQuery", я предполагаю, что вы хотите прикрепить обработчик событий щелчка. Если это так, просто сделайте то же самое, что и выше, а затем используйте что-то вроде следующего JavaScript:

$('#fake-link-1').click(function() {
    /* put your code here */
});

Answer 3

Чтобы вообще ничего не делать, используйте это:

<a href="javascript:void(0)"> ... </a>

Answer 4

Правильный способ справиться с этим - «разорвать» ссылку с помощью jQuery при обработке ссылки

HTML

<a href="#" id="theLink">My Link</a>

JS

$('#theLink').click(function(ev){
    // do whatever you want here

    ev.preventDefault();
    ev.stopPropagation();
});

Эти два последних вызова не позволяют браузеру интерпретировать щелчок.

Answer 5

Что вы подразумеваете под ничем?

<a href='about:blank'>blank page</a>

или

<a href='whatever' onclick='return false;'>won't navigate</a>

Answer 6

Есть так много способов сделать это, как

Не добавлять и href атрибут

<a name="here"> Test <a>

Вы можете добавить событие onclick вместо href, как

<a name="here" onclick="YourFunction()"> Test <a>

Или вы можете добавить функцию void, как это было бы наилучшим образом

<a href="javascript:void(0);"> 
<a href="javascript:;">

Answer 7

Я думаю, вы можете попробовать

<a href="JavaScript:void(0)">link</a>

Единственный улов, который я вижу здесь, - это высокий уровень безопасности браузера, который может запрашивать выполнение javascript.

Хотя это один из более простых способов, чем

<a href="#" onclick="return false;">Link</a>

это следует использовать экономно

Прочитайте эту статью для некоторых указателей https://web.archive.org/web/20090301044015/http://blog.reindel.com/2006/08/11/a-hrefjavascriptvoid0-avoid-the-void

Answer 8

Этот ответ должен быть обновлен с учетом новых веб-стандартов (HTML5).

Это:

<a tabindex="0">This represents a placeholder hyperlink</a>

... действительный HTML5. Атрибут tabindex делает клавиатуру фокусируемой, как обычные гиперссылки. Вы могли бы также использовать элемент span для этого, как упоминалось ранее, но я считаю, что использование элемента a более элегантно.

См .: http://dev.w3.org/html5/markup/a.html
и: http://www.w3.org/html/wg/drafts/html/master/links.html#attr-hyperlink-href

Answer 9

Вот три способа, которыми свойство тега <a> тега *1001* ссылается ни на что:

<a href="JavaScript:void(0)"> link </a>

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

<a href="#" onclick="return false;"> Link </a>

Answer 10

Убедитесь, что все ваши ссылки, которые вы хотите остановить, имеют href="#!" (или все, что вы хотите, действительно), а затем используйте это:

jq('body').on('click.stop_link', 'a[href="#!"]',
function(event) {
     event.preventDefault();
});