Як відключити посилання href в JavaScript?

У мене є тег, <a href="#"> Previous </a> 1 2 3 4 <a href="#"> Next </a>і в деяких умовах я хочу, щоб цей тег був повністю відключений.

Код з коментарів (так створюється посилання)

if (n_index != n_pages) 
    a = a+'<li><a href="#" onclick="javascript:paginateAjaxPage('+(n_index+1) +','+stype+');">></a></li><li><a href="#" onclick="javascript:paginateAjaxPage('+n_pages+','+stype+');" >>></a></li>'; 
else 
    a = a+'<li><a style="cursor: pointer;" onclick="return false;">></a></li><li><a style="cursor: pointer;" onclick="return false" >>></a></li>'; 
a = a+'</ul></div>';

Спробуйте це, коли ви не хочете, щоб користувач переспрямовував натискання

<a href="javascript: void(0)">I am a useless link</a>

ви можете відключити всі посилання на сторінці цього класу стилів:

a {
    pointer-events:none;
}

тепер, звичайно, хитрість - дезактивувати посилання лише тоді, коли вам це потрібно, ось як це зробити:

використовувати порожній клас A, наприклад:

a {}

тоді, коли ви хочете відключити посилання, зробіть це:

    GetStyleClass('a').pointerEvents = "none"

    function GetStyleClass(className)
    {
       for (var i=0; i< document.styleSheets.length; i++) {
          var styleSheet = document.styleSheets[i]

          var rules = styleSheet.cssRules || styleSheet.rules

          for (var j=0; j<rules.length; j++) {
             var rule = rules[j]

             if (rule.selectorText === className) {
                return(rule.style)
             }
          }
       }

       return 0
    }

ПРИМІТКА: Назви правил CSS перетворюються на малі регістри в деяких браузерах, і цей код чутливий до регістру, тому краще використовувати для цього імена нижчих регістрів класів

для повторної активації посилань:

GetStyleClass('a').pointerEvents = ""

перегляньте сторінку http://caniuse.com/pointer-events, щоб дізнатися про сумісність браузера

Я думаю, що це найкращий спосіб зробити це, але, на жаль, IE, як завжди, не дозволять це :) Я все-таки публікую це, тому що я думаю, що в ньому є інформація, яка може бути корисною, і тому, що в деяких проектах використовується браузер, що знає , наприклад, коли ви використовуєте веб-перегляди на мобільних пристроях.

якщо ви просто хочете відключити ОДНЕ посилання (я лише усвідомлюю, що це питання), я використовував би функцію, яка вручну встановлює URL-адресу поточної сторінки, чи ні, виходячи з цієї умови. (як рішення, яке ви прийняли)

це питання було ЛОТИ простіше, ніж я думав :)

Ви можете просто дати йому порожній хеш:

anchor.href = "#";

або якщо це недостатньо добре для "відключення", використовуйте обробник подій:

anchor.href = "javascript:void(0)";

Спробуйте це за допомогою jQuery:

$(function () {
    $('a.something').on("click", function (e) {
        e.preventDefault();
    });
});

anchor.href = null;

(function ($) {
    $( window ).load(function() {
        $('.navbar a').unbind('click');
        $('.navbar a').click(function () {
            //DO SOMETHING
            return false;
        });
    });
})(jQuery);

Мені цей спосіб простіше здійснити. І це перевага, що ви js. Знаходиться не у вашому HTML, а в іншому файлі. Я думаю, що без розв’язування. Обидві події досі активні. Не впевнений. Але певним чином вам потрібна лише ця подія

MDN рекомендує element.removeAttribute(attrName);встановлювати атрибут на null (або якесь інше значення), коли потрібно відключити його. У цьому випадку це було бelement.removeAttribute("href");

https://developer.mozilla.org/en-US/docs/Web/API/Element/removeAttribute

Найпростіший спосіб відключити посилання - це просто не показувати його. Запускайте цю функцію всякий раз, коли ви хочете перевірити, чи виконана ваша умова, щоб приховати кнопку Попередній (замініть її if (true)умовою):

var testHideNav = function() {
    var aTags = document.getElementsByTagName('a'),
        atl = aTags.length,
        i;

    for (i = 0; i < atl; i++) {
        if (aTags[i].innerText == "Previous") {
            if (true) { // your condition to disable previous
                aTags[i].style.visibility = "hidden";
            } else {
                aTags[i].style.visibility = "visible";
            }
        } else if (aTags[i].innerText == "Next") {
            if (false) { // your condition to disable next
                aTags[i].style.visibility = "hidden";
            } else {
                aTags[i].style.visibility = "visible";
            }
        }
    }
};

Потім запустіть, testHideNav()коли вам потрібно зробити перевірку, чи змінився ваш стан.

Замість цього використовуйте проміжок і onclick javascript. Деякі браузери "стрибають", якщо у вас є посилання та "#" href.

Це теж можливо:

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

Посилання нікуди не переходить за вашою функцією.

У мене була подібна потреба, але моя мотивація полягала в тому, щоб не допустити подвійного клацання посилання. Я здійснив це за допомогою jQuery:

$(document).ready(function() {
    $("#myLink").on('click', doSubmit);
});

var doSubmit = function() {
    $("#myLink").off('click');
    // do things here
};

HTML виглядає приблизно так:

<a href='javascript: void(0);' id="myLink">click here</a>

Отже, вищезазначені рішення змушують посилання не працювати, але не роблять видимим (AFAICT), що посилання більше не діє. У мене виникла ситуація, коли у мене є серія сторінок і я хочу відключити (і зробити очевидним, що це вимкнено) посилання, яке вказує на поточну сторінку.

Так:

window.onload = function() {
    var topics = document.getElementsByClassName("topics");
    for (var i = topics.length-1; i > -1; i-- ) {
        for (var j = topics[i].childNodes.length-1; j > -1; j--) {
             if (topics[i].childNodes[j].nodeType == 1) {
                if (topics[i].childNodes[j].firstChild.attributes[0].nodeValue == this.n_root3) {
                    topics[i].childNodes[j].innerHTML = topics[i].childNodes[j].firstChild.innerHTML;
                }
            }
        }
    }
}

Це переходить до списку посилань, знаходить те, що вказує на поточну сторінку (n_root3 може бути місцевим, але я думаю, documentмає мати щось подібне), і замінює посилання вмістом тексту посилання.

HTH

Дякую вам всім...

Моя проблема вирішена нижче кодом:

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

Встановіть цей плагін для jquery і використовуйте його

http://plugins.jquery.com/project/jqueryenabledisable

Це дозволяє відключити / включити майже будь-яке поле сторінки.

Якщо ви хочете відкрити сторінку за певної умови, напишіть функцію сценарію java і зателефонуйте їй з href. Якщо умова задоволена, ви відкриєте сторінку в іншому випадку просто нічого не робіть.

код виглядає приблизно так:

<a href="javascript: openPage()" >Click here</a>

and function:
function openPage()
{
if(some conditon)
opener.document.location = "http://www.google.com";
}
}

Ви також можете помістити посилання у div і встановити властивість відображення атрибуту Style до жодної. це приховає діву. Наприклад,

<div id="divid" style="display:none">
<a href="Hiding Link" />
</div>

Це приховає посилання. За допомогою кнопки або зображення зробіть видимий цей діб зараз, зателефонувавши в функцію onclick як:

<a href="Visible Link" onclick="showDiv()">

and write the js code as:

function showDiv(){
document.getElememtById("divid").style.display="block";
}

Ви також можете помістити тег id в тег html, так було б

<a id="myATag" href="whatever"></a>

І отримайте цей ідентифікатор у своєму JavaScript за допомогою

document.getElementById("myATag").value="#"; 

Одне з цього повинно працювати точно

Ще один спосіб відключення посилання

element.removeAttribute('href');

якірний тег без href буде реагувати як інвалід / звичайний текст

<a> w/o href </a>

замість <a href="#"> with href </a>

див. jsFiddel

сподіваюся, що це гепл.

Замість пустоти ви також можете використовувати:

<a href="javascript:;">this link is disabled</a> 

0) вам краще запам'ятати, що деякі браузери "стрибають", якщо у вас є посилання та "#" href. Тож найкращим способом був би користувацький JavaScript

1) Якщо ви користуєтеся спеціальним JavaScript , ось він:

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

"Помилкове повернення" запобігає фактичному переходу посилання.

2) Ви можете розглянути можливість уникнення використання наступного

<a href="javascript:void(0);" onclick="DoSomething();">Link</a>

або

  <a href="javascript:;" onclick="DoSomething();">Link</a>

Оскільки псевдопротокол javascript може перевести сторінку в стан очікування в деяких браузерах, що може мати несподівані наслідки. IE6 відомий цим. Але якщо вам не байдуже IE6, і ви все тестуєте - це може бути хорошим рішенням.

3) Якщо у вас вже є jQueryі bootstrapу вашому проекті, ви можете розглянути їх як:

$('.one-click').on("click", function (e) {
   $( this ).addClass('disabled');
});

де .disabledклас надходить з форми завантаження.

Сайт для завантаження форми Qupte ( тут )

Застереження щодо функціональності

Клас .disabled використовує, pointer-events: noneщоб спробувати відключити функціональність посилання s, але ця властивість CSS ще не стандартизована. Крім того, навіть у веб-переглядачах, які підтримують події-покажчики: немає, навігація по клавіатурі залишається незмінною, а це означає, що помітні користувачі клавіатури та користувачі допоміжних технологій все одно зможуть активувати ці посилання. Так що для безпечності додайте tabindex="-1"атрибут у ці посилання (щоб не допустити їх фокусування на клавіатурі) та використовуйте custom JavaScriptдля відключення їх функціональності.

і custom JavaScriptпоказано в розділі 1

Нижче код для відключених посилань:

<a href="javascript: void(0)">test disabled link</a> 

Ще одне дуже просте рішення:

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

Перше рішення є ефективним.