Jquery/Bootstrap deaktivieren Schaltfläche

Question

Hey iv suchte nach einer Lösung mit JQuery oder durch Ändern der twitter-Bootstrap-Klasse, um zu verhindern, dass eine Schaltfläche ihre onclick-Aktion durchführen oder diese deaktivieren. Allerdings fand die Ergebnisse iv bisher nicht richtig durchgeführt und meist nur eine Erscheinung geben deaktiviert werden aber nach wie vor richtig auszuführen:

$("#previous").prop('disabled', true); 
$("#next").prop('disabled', true); 

Der Zweck ist, tauschen Registerkarten zu verhindern, wenn die Registerkarte Index zu hoch oder zu niedrig ist. Die meisten anderen Lösungen scheinen riesige Mengen scheinbar unnötigen Javascript für ein Feature enthalten, das relativ einfach scheint.

wie diese:

$("#previous").click(function() { 
    var me = $(this); 
    me.unbind("click");    
}) 

Welche soll die gebundene Funktion entfernen, würde aber auch bedeuten, das Ereignis wieder anbringen, wenn die Registerkarte Index steigt. Gibt es eine einfachere Lösung, um eine Schaltfläche vorübergehend zu deaktivieren oder einfach zu verhindern, dass die Standardaktion ausgeführt wird, ohne das Ereignis zu entfernen oder das Schaltflächenelement nicht anzuzeigen?

Jede Hilfe würde geschätzt :)

Answer 1

Wenn Sie Twitter Bootstrap verwenden, gibt es genau dieses Verhalten bereits für Sie implementiert.

Sie müssen nur die Klasse .disabled des Elements, das Sie deaktivieren möchten, ändern.

Like:

$("#previous").addClass('disabled'); 

Answer 2

Sie würden die Standard-Aktion zu verhindern, haben mit event.preventDefault()

$("#previous").click(function(event) { 
    //add logic to attach style behavior here or conditionally prevent default 
     event.preventDefault();  
}); 

Answer 3

mich ein einfaches Beispiel zeigen lassen. Hier wird eine Schaltfläche deaktiviert, sobald Sie darauf klicken.

<button class="btn btn-danger">Click Me</button> 

$('.btn-danger').on('click', function() { 

    if ($(this).hasClass('disabled')) { 
     return false; 
    } else { 
     $(this).addClass('disabled'); 
    } 
});