Bazen tutturur düğmeleri tarz olarak kullanıyorum ve sadece düğmeleri kullanın bazen. Böylece belirli klik-her şey devre dışı bırakmak istiyorum

• Engelli görünüyorlar
• Tıkladım olmak bırakırlar

Bunu nasıl yapabilirim?

Düğmeleri

Düğmeler disabled tarayıcı tarafından işlenir hangi düğme bir özellik olarak devre dışı bırakmak için basit

<input type="submit" class="btn" value="My Input Submit" disabled/>
<input type="button" class="btn" value="My Input Button" disabled/>
<button class="btn" disabled>My Button</button>

Özel bir WordPress kullanmak bir işlevi ile bu devre dışı bırakmak için, sadece fn.extend() kullanmak istiyorum:

// Disable function
jQuery.fn.extend({
    disable: function(state) {
        return this.each(function() {
            this.disabled = state;
        });
    }
});

// Disabled with:
$('input[type="submit"], input[type="button"], button').disable(true);

// Enabled with:
$('input[type="submit"], input[type="button"], button').disable(false);

JSFiddle disabled button and input demo.

Aksi jQuery kullanımı 35* *yöntemi yapmak istiyorum:

$('button').prop('disabled', true);
$('button').prop('disabled', false);

Etiketler Çapa

disabled valid property çapa için bir kategori olmadığını belirtmekte yarar var. Bu nedenle, Bootstrap .btn elemanları üzerine aşağıdaki stil kullanır:

.btn.disabled, .btn[disabled] {
    cursor: default;
    background-image: none;
    opacity: 0.65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    color: #333;
    background-color: #E6E6E6;
}

[disabled] özelliği de .disabled bir sınıf olarak hedeflenen nasıl not. .disabled sınıfı bir bağlantı etiketi devre dışı görünür yapmak için gerekli olan budur.

<a href="http://example.com" class="btn">My Link</a>

Tabii ki, bu tıklandığında çalışmasını bağlantıları engellemez. Yukarıdaki link http://example.com götürecek. Bunu önlemek için, DV kodu basit bir parça event.preventDefault() arama disabled sınıfı ile bağlantı etiketlerini hedef Ekle:

$('body').on('click', 'a.disabled', function(event) {
    event.preventDefault();
});

toggleClass() kullanarak disabled sınıf geçiş yapabiliriz:

jQuery.fn.extend({
    disable: function(state) {
        return this.each(function() {
            var $this = $(this);
            $this.toggleClass('disabled', state);
        });
    }
});

// Disabled with:
$('a').disable(true);

// Enabled with:
$('a').disable(false);

JSFiddle disabled link demo.

Kombine

O zaman önceki devre dışı bırak işlevi yukarıda yapılan is() kullanarak devre dışı bırakmak için çalışıyoruz öğenin türünü kontrol etmek için genişletebiliriz. Bu şekilde eğer input button bir öğe değil. eğer 28 ** ya o disabled özelliğini değiştirmek:

// Extended disable function
jQuery.fn.extend({
    disable: function(state) {
        return this.each(function() {
            var $this = $(this);
            if($this.is('input, button'))
              this.disabled = state;
            else
              $this.toggleClass('disabled', state);
        });
    }
});

// Disabled on all:
$('input, button, a').disable(true);

// Enabled on all:
$('input, button, a').disable(false);

Full combined JSFiddle demo.

Tüm giriş türleri hakkında daha fazla yukarıdaki işlevi de çalışacağını belirtmekte yarar var.