顏色只改變一次爲Css禁用按鈕

Question

我試圖改變我的按鈕顏色，一旦它從禁用啓用，但這隻發生一次。我改變顏色的大致流程如下：

function validate(){ 
    if ($("#password").val().length > 4 && $("#token").val().length > 4) { 
    $("#validateSign ").css({ 
     "background-color": "#f1f1f1", 
     "background-image": "url(../../images/images/bg_btn_transaction.gif)", 
     "border-color": "#428d0a", 
     "color":" #428d0a", 
     "border-right": "1px solid #428d0a", 
     "border-bottom": "1px solid #428d0a", 
     "cursor":" pointer" 
    }).prop("disabled", false); 
    } else { 
    $("#validateSign") .prop("disabled", true); 
    } 
} 

我從我的jQuery function.ready（）調用：

validate(); 
$("#password, #token").keyup(validate); 

它正在改變顏色，但只有一次。感謝您的幫助提前。

Answer 1

您必須在else {條件下將所有css恢復爲默認狀態。

爲更簡單的方法，你應該創建CSS：

.nope { 
    background-color: #f1f1f1; 
    background-image: url(../../images/images/bg_btn_transaction.gif); 
    border-color: #428d0a; 
    color: #428d0a; 
    border-right: 1px solid #428d0a; 
    border-bottom: 1px solid #428d0a; 
    cursor: pointer; 
} 

那麼你的jQuery應該是：

function validate(){ 
    if ($("#password").val().length > 4 && $("#token").val().length > 4) { 
    $("#validateSign ").addClass('nope').prop("disabled", false); 
    } else { 
    $("#validateSign") .removeClass('nope').prop("disabled", true); 
    } 
}