Як зробити тег прив’язки до нічого не посилатися?

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

Я зазвичай пишу так:

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

Однак це стосується верхньої частини сторінки!

Якщо ви не хочете, щоб це вказувало на що-небудь, ви, ймовірно, не повинні використовувати <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 */
});

Є кілька менш ніж ідеальних рішень:

1. Посилання на підроблений якір

<a href="#">

Проблема: натискання на посилання переходить на верхню частину сторінки

2. Використання тегу, відмінного від "a"

Використовуйте тег span та використовуйте jquery для обробки клацання

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

3. Посилання на функцію анулювання javascript

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

Проблема: розриви під час з'єднання зображень у IE

Рішення

Оскільки всі вони мають свої проблеми, рішення, на якому я вирішив, полягає в тому, щоб зв’язати підроблений якір, а потім повернути false з методу onClick:

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

Не найкоротше рішення, але воно вирішує всі проблеми з перерахованими вище методами.

Щоб змусити його нічого не робити, скористайтеся цим:

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

Правильний спосіб впоратися з цим - це "розірвати" посилання на jQuery, коли ви обробляєте посилання

HTML

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

JS

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

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

Ці останні два дзвінки зупиняють браузер інтерпретувати клацання.

Існує так багато способів, як це зробити

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

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

Ви можете додати подію onclick замість href, як

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

Або ви можете додати недійсну функцію на зразок цієї, яка була б найкращим способом

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

Що ти означає нічого?

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

або

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

Я думаю, ти можеш спробувати

<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

Цю відповідь слід оновити, щоб відображати нові веб-стандарти (HTML5).

Це:

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

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

Дивіться: https://w3c.github.io/html-reference/a.html
та: https://html.spec.whatwg.org/multipage/links.html#attr-hyperlink-href

Ось три способи для <a>тега hrefвласності тегів відносяться ні до чого:

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

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

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

Я знаю, що це давнє питання, але я думав, що все одно додам свої два центи:

Це залежить від того, що посилання буде робити, але зазвичай я вказуватиму на посилання на URL, який, можливо, може відображати / робити те саме, наприклад, якщо ви робите трохи про спливаюче вікно:

<a id="about" href="/about">About</a>

Потім з jQuery

$('#about').click(function(e) {
    $('#aboutbox').show();
    e.preventDefault();
});

Таким чином, дуже старі веб-переглядачі (або веб-переглядачі з відключеним JavaScript) все ще можуть переходити до окремої сторінки, але що ще важливіше, Google також вибере це і сканує вміст сторінки.

Переконайтеся, що всі ваші посилання, які ви хочете припинити href="#!"(або все, що завгодно, насправді), а потім скористайтеся цим:

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

Ви можете мати HTML-якор ( aтег) без hrefатрибута. Залиште hrefатрибут, і він ні до чого не зв’яжеться:

<a>link</a>

Єдине, що для мене спрацювало, було поєднання вищезазначеного:

Спочатку лі в уль

<li><a onclick="LoadTab2_1()" href="JavaScript:void(0)">All Assigned</a></li>

Потім у LoadTab2_1 я вручну перемикав вкладки діви

$("#tabs-2-1").hide();
    $("#tabs-2-2").show();

Це відбувається тому, що відключення також відключає дію на вкладках

Також потрібно вручну виконати стилізацію вкладки, коли основна вкладка змінить речі

$("#secTab1").addClass("ui-tabs-active").addClass("ui-state-active").addClass("ui-state-hover").addClass("ui-state-focus");
    $("#secTab1 a").css("color", "#ffffff");

Ви можете це зробити за допомогою

<a style='cursor:pointer' >Link</a>

<a href="#" onclick="SomeFunction()"  class="SomeClass">sth.</a>

це була моя прив’язка. тому повернути false onClick = "" подія тут не корисно. Щойно я видалив властивість href = "#", і він працював для мене так само, як нижче

<a onclick="SomeFunction()"  class="SomeClass">sth.</a>

і мені потрібно було додати цей css.

.SomeClass
{
    cursor: pointer;
}

Я зіткнувся з цим питанням на сайті WordPress. Заголовки в спадному меню завжди мали атрибут, href=""а плагін заголовка використовувався лише дозволеними стандартними URL-адресами. Найпростішим рішенням було просто запустити цей код у нижньому колонтитулі:

jQuery('[href=""]').click(function(e){
    e.preventDefault();
});

Це не дасть чистим якорям нічого робити.

Реакція більше не підтримує використання такої функції href="javascript:void(0)"у вашому тезі прив’язки, але ось щось дуже добре працює.

<a href="#" onClick={() => null} >link</a>

Я знаю, що це позначено як питання jQuery, але ви можете відповісти на це також за допомогою AngularJS.

у своєму елементі додайте директиву ng-click та використовуйте змінну $ event, яка є подією клацання ... запобігайте її поведінці за замовчуванням:

<a href="#" ng-click="$event.preventDefault()">

Ви навіть можете передати змінну $ event у функцію:

<a href="#" ng-click="doSomething($event)">

в цій функції ви робите все, що завгодно, з подією натискання.