JavaScript'te bir href bağlantısını nasıl devre dışı bırakırım?

Bir etiketim var <a href="#"> Previous </a> 1 2 3 4 <a href="#"> Next </a>ve bazı durumlarda bu etiketin tamamen devre dışı bırakılmasını istiyorum.

Yorumlardan gelen kod (bağlantı bu şekilde oluşturulur)

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>';

Kullanıcının tıklamayı yeniden yönlendirmesini istemediğinizde bunu deneyin

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

Bu stil sınıfıyla bir sayfadaki tüm bağlantıları devre dışı bırakabilirsiniz:

a {
    pointer-events:none;
}

şimdi elbette işin püf noktası, bağlantıları yalnızca ihtiyacınız olduğunda devre dışı bırakmaktır, bu nasıl yapılır:

bunun gibi boş bir A sınıfı kullanın:

a {}

sonra bağlantıları devre dışı bırakmak istediğinizde şunu yapın:

    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
    }

NOT: CSS kural adları bazı tarayıcılarda küçük harfe dönüştürülür ve bu kod büyük / küçük harfe duyarlıdır, bu nedenle bunun için küçük harfli sınıf adları kullanın

bağlantıları yeniden etkinleştirmek için:

GetStyleClass('a').pointerEvents = ""

tarayıcı uyumluluğu hakkında bilgi için bu sayfayı http://caniuse.com/pointer-events kontrol edin

Bunu yapmanın en iyi yolu olduğunu düşünüyorum, ancak ne yazık ki IE, her zaman olduğu gibi buna izin vermeyecek :) Bunu yine de gönderiyorum, çünkü bunun yararlı olabilecek bilgiler içerdiğini düşünüyorum ve bazı projeler bildiğiniz bir tarayıcı kullanıyor mobil cihazlarda web görünümlerini kullanırken olduğu gibi.

Eğer sadece BİR bağlantıyı devre dışı bırakmak istiyorsanız (sadece sorunun bu olduğunu anlıyorum), mevcut sayfanın url'sini manuel olarak ayarlayan veya bu koşula göre ayarlamayan bir işlev kullanırdım. (kabul ettiğiniz çözüm gibi)

bu soru düşündüğümden çok daha kolaydı :)

Basitçe boş bir hash verebilirsiniz:

anchor.href = "#";

veya bu yeterince iyi değilse bir "devre dışı bırakma", bir olay işleyici kullanın:

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

Bunu jQuery kullanarak deneyin:

$(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);

Bu yolu uygulamayı daha kolay buluyorum. Ve senin js avantajına sahip. HTML'nizin içinde değil farklı bir dosyadadır. Bunu çözmeden düşünüyorum. Her iki olay da hala aktif. Emin değil. Ama bir şekilde sadece bu tek olaya ihtiyacınız var

MDN element.removeAttribute(attrName);, devre dışı bırakmak istediğinizde, özniteliğin null (veya başka bir değer) olarak ayarlanmasını önerir . Bu durumda,element.removeAttribute("href");

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

Bir bağlantıyı devre dışı bırakmanın en kolay yolu, onu göstermemektir. Önceki düğmesini gizlemek için koşulunuzun karşılanıp karşılanmadığını test etmek istediğinizde bu işlevi çalıştırın ( if (true)koşulunuzla değiştirin ):

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";
            }
        }
    }
};

Ardından testHideNav(), durumunuzun değişip değişmediğini kontrol etmeniz gerektiğinde koşun .

Bunun yerine bir aralık ve bir javascript onclick kullanın. Bağlantınız ve "#" href varsa bazı tarayıcılar "atlar".

Bu da mümkündür:

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

Bağlantınız hiçbir yere gitmez, fonksiyonunuz çalıştırılır.

Benzer bir ihtiyacım vardı, ancak motivasyonum bağlantının çift tıklanmasını önlemekti. JQuery kullanarak başardım:

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

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

HTML şöyle görünür:

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

Dolayısıyla, yukarıdaki çözümler bağlantının çalışmamasını sağlar, ancak bağlantının artık geçerli olmadığını görünür kılmaz (AFAICT). Bir dizi sayfamın olduğu ve mevcut sayfaya işaret eden bağlantıyı devre dışı bırakmak (ve devre dışı olduğunu açıkça göstermek) istediğim bir durum var.

Yani:

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;
                }
            }
        }
    }
}

Bu, bağlantı listesinde dolaşır, geçerli sayfaya işaret eden birini bulur (n_root3 yerel bir şey olabilir, ancak documentbenzer bir şeye sahip olması gerektiğini düşünüyorum) ve bağlantıyı bağlantı metni içeriğiyle değiştirir.

HTH

Hepinize teşekkür ederim...

Sorunum aşağıdaki kodla çözüldü:

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

Bu eklentiyi jquery için kurun ve kullanın

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

Sayfadaki hemen hemen her alanı devre dışı bırakmanıza / etkinleştirmenize olanak tanır.

Herhangi bir koşulda bir sayfa açmak istiyorsanız, bir java komut dosyası işlevi yazın ve onu href'den çağırın. Koşul, sayfayı açmanızı sağlıyorsa, aksi takdirde hiçbir şey yapmayın.

kod şuna benzer:

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

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

Ayrıca bağlantıyı bir div içine koyabilir ve Style niteliğinin display özelliğini yok olarak ayarlayabilirsiniz. bu div'i gizleyecektir. Örneğin,

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

Bu bağlantıyı gizleyecektir. Onclick'te bu işlevi şu şekilde çağırarak bu div'i görünür kılmak için bir düğme veya resim kullanın:

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

and write the js code as:

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

Ayrıca html etiketine bir kimlik etiketi de koyabilirsiniz, böylece

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

Ve bu kimliği kullanarak javascript'inize alın

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

Bunlardan biri kesinlikle çalışmalı haha

Bağlantıyı devre dışı bırakmak için başka bir yöntem

element.removeAttribute('href');

href içermeyen bağlantı etiketi devre dışı / düz metin olarak tepki verir

<a> w/o href </a>

onun yerine <a href="#"> with href </a>

jsFiddel'e bakın

umarım bu çok yararlıdır.

Void yerine şunları da kullanabilirsiniz:

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

0) Bir bağlantınız ve "#" href'iniz varsa bazı tarayıcıların "atladığını" hatırlasanız iyi olur. Bu yüzden en iyi yol, özel bir JavaScript

1) Eğer sonra özel JavaScript , işte burada:

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

"Dönüş yanlış", bağlantının gerçekten izlenmesini engeller.

2) Aşağıdakileri kullanmaktan kaçınmayı düşünebilirsiniz

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

veya

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

Çünkü javascript sözde protokolü bazı tarayıcılarda sayfayı bekleme durumuna getirebilir ve bu da beklenmedik sonuçlar doğurabilir. IE6 bununla tanınır. Ancak IE6'yı önemsemiyorsanız ve her şeyi test ediyorsanız - bu iyi bir çözüm olabilir.

3) Halihazırda varsa jQueryve bootstrapprojenizde, bunları şu şekilde kullanmayı deneyebilirsiniz:

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

nerede .disabledsınıf formu ön yükleme alanı geliyor.

Qupte form bootstrap sitesi ( burada )

Bağlantı işlevselliği uyarısı

.Disabled sınıfı, URL'lerin pointer-events: nonebağlantı işlevini devre dışı bırakmayı denemek için kullanır , ancak bu CSS özelliği henüz standartlaştırılmamıştır. Ek olarak, işaretçi olaylarını destekleyen tarayıcılarda bile: yok, klavye gezintisi etkilenmeden kalır, yani gören klavye kullanıcıları ve yardımcı teknolojilerin kullanıcıları bu bağlantıları etkinleştirmeye devam edebilir. Bu nedenle, güvenli olmak için, tabindex="-1"bu bağlantılara bir özellik ekleyin (klavye odağını almalarını önlemek için) ve custom JavaScriptişlevlerini devre dışı bırakmak için kullanın .

ve custom JavaScriptbölüm 1'de gösterildi

Devre dışı bırakılan bağlantılar için aşağıdaki kod:

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

başka bir çok basit çözüm şudur:

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

İlk çözüm etkilidir.