SORU
23 NİSAN 2012, PAZARTESİ


Nasıl HTML bağlantıları devre dışı bırakmak için

Düğmesini devre dışı bırakmak için var olan bir TD içinde bir link var. Bu IE üzerinde çalışıyor ama Firefox ve Chrome. Yapı - TD iç Link. TD içinde herhangi bir kapsayıcı (div/span gibi) eklemek edemem

Aşağıdaki denedim ama Firefox (1.4.2 js kullanarak) çalışmıyor:

$(td).children().each(function () {
        $(this).attr('disabled', 'disabled');
  });


  $(td).children().attr('disabled', 'disabled');

  $(td).children().attr('disabled', true);

  $(td).children().attr('disabled', 'true');

Not yapamam kayıtlı olduğu gibi de-kayıt çapa etiketi için tıklayın işlevi dinamik olarak. VE DEVRE DIŞI MODUNDA BAĞLANTIYI GÖSTERECEĞİM.

CEVAP
23 NİSAN 2012, PAZARTESİ


Bir bağlantı (taşınabilir bir şekilde) devre dışı bırakabilirsiniz. Bunlardan biri de (kendi avantajları ve dezavantajları her biri) kullanabilirsiniz.

CSS yolu

Bu olmalıdırdoğru yolutarayıcıların çoğu bunu destekleyecek ne zaman bunu yapmak için:

a.disabled {
    pointer-events: none;
}

Aslında (2015) Peki sadece Chrome, FireFox ve Opera (son sürüm) tarafından desteklenen. Internet Explorer ama not for links sürüm 11'den bu desteklemeye başladı.

Geçici çözüm

Biz, muhtemelen, eğer biz pointer-events: none ama ne için CSS sınıfı tanımlamak gerekiryenidendisabled CSS sınıfı yerine özniteliği? Kesinlikle disabled <a> için desteklenmiyor ama tarayıcılar konuşma için bir şey demesinbilinmeyenöznitelikleri. disabled özellik IE kullanıyorum ama IE disabled özel öznitelik onur duyarız pointer-events göz ardı eder; diğer CSS şikayet tarayıcıları göz ardı ederbilinmeyendisabled nitelik ve pointer-events onur. Daha kolay açıklamak daha yazmak için:

a[disabled] {
    pointer-events: none;
}

Müdahale tıklama

href JavaScript için bir işlevi kullanmak (ya da özürlü kendisi öznitelik) durumunu kontrol edin ve durumda bir şey yok.

$("td > a").on("click", function(event){
    if ($(this).is("[disabled]")) {
        event.preventDefault();
    }
});

Bağlantıları devre dışı bırakmak için:

$("td > a").attr("disabled", "disabled");

Yeniden etkinleştirmek onlara

$("td > a").removeAttr("disabled");

Eğer istediğiniz yerine .is("[disabled]") kullanabilirsiniz .attr("disabled") != undefined (jQuery 1.6 için undefined zaman özniteliği ayarlı değil) ama is() çok daha net (teşekkürler Dave Stewart için bu ipucu). Lütfen not buradayım kullanarak disabled öznitelik standart olmayan bir şekilde, eğer istediğin bu o zaman yerine özniteliği bir sınıf ve değiştirme .is("[disabled]") .hasClass("disabled") (ekleme ve çıkarma addClass() removeClass()).

Bağlantı açık

href özniteliği temizleyin. Bu kod ile bir olay işleyicisi ekleyin ama kendisini bağlantı değiştirin. Bu kod bağlantıları devre dışı bırakmak için kullanın:

$("td > a").each(function() {
    this.data("href", this.attr("href"))
        .attr("href", "javascript:void(0)")
        .attr("disabled", "disabled");
});

Ve yeniden etkinleştirmek için bu onlara

$("td > a").each(function() {
    this.attr("href", this.data("href")).removeAttr("disabled");
});

Şahsen bu çözüm çok özürlü bağlantıları yapmanız durumunda değil () ama onu sevmiyorumolabilirbir bağlantıyı takip etmek için çeşitli yol nedeniyle daha uyumlu olacak.

Sahte tıklama işleyicisi

/return false bağlantı takip olmayacak yerde onclick bir fonksiyon Ekle. Bağlantıları devre dışı bırakmak için:

$("td > a").attr("disabled", "disabled").on("click", function() {
    return false; 
});

Yeniden etkinleştirmek onlara

$("td > a").removeAttr("disabled").off("click");

İlki yerine bu çözümü tercih etmek için bir neden yoktur sanmıyorum.

Stil

Stil CSS kuralı aşağıdaki kullanabilmek disabled nitelik Ekle yaptık bağlantısını devre dışı bırakmak için her ne kullanıyorsunuz: daha da basit

a[disabled] {
    color: gray;
}

Öznitelik yerine: bir sınıf kullanıyorsanız

a.disabled {
    color: gray;
}

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Dopelives

    Dopelives

    30 Temmuz 2009
  • MusicDeluxeTV

    MusicDeluxeT

    14 Mayıs 2010
  • Crossover

    Crossover

    18 HAZİRAN 2007