2013-07-15 23 views
0

內不工作我有一個.on('click', function())正在調用另一個函數removeClass功能

$('.controls a[data-attr="editEmailAddress"]').on('click', function (e) { 
    e.preventDefault(); 
    if ($(this).hasClass("btn-primary")) { 
     updateEmailAddress(); 
    } else { 
     hideSuccess(); 
    } 
    $(this).addClass("btn-primary"); 
    $(this).find('i').addClass("icon-white icon-edit").addClass('icon-ok'); 
    $(this).siblings('input[type=text]').attr('disabled', false); 
}); 

功能做了一些標準的驗證,如果它是有效的它應該刪除類btn-primary中一些其他的事情。

function updateEmailAddress() { 
    // Clear the error div of any previous errors 
    $('#validationSummary').hide().empty(); 

    var isValid = true; 

    // Must Enter Email Address 
    var emailEntered = $('#txtEmailAddress').val(); 
    if (!$.trim(emailEntered).length) { 
     $('#validationSummary').append('Email address required').fadeIn(); 
     isValid = false; 
    } 
    else { 
     // If Email Entered verify that it is a valid email address 
     if (!validateEmail(emailEntered)) { 
      $('#validationSummary').append('Enter valid email address.').fadeIn(); 
      isValid = false; 
     } 
    } 
    if (isValid) { 
     // Change state of edit icon 
     $('#lnkEditEmailAddress').removeClass("btn-primary"); 
     $('#lnkEditEmailAddress').find('i').addClass("icon-white icon-edit").addClass('icon-ok'); 
     $('#lnkEditEmailAddress').siblings('input[type=text]').removeAttr('disabled', true); } 
} 

這裏是一個工作jsfiddle

有人能找出什麼樣的變化將需要作出獲取輸入/圖像返回到原來禁用狀態?這是否與頁面加載時不在DOM中的類有關?

顯然有一個網絡的方法,不會導致錯誤

+1

只需要注意幾點,但在jQuery 1.9中,您應該使用.prop()而不是.attr()作爲禁用屬性。此外,一旦該屬性設置,你刪除它,我不相信你可以添加它。看到這篇文章:http://stackoverflow.com/questions/1414365/how-to-disable-an-input-with-jquery – CSharpConductor

回答

1

的問題是,你的功能不停止一次updateEmailAddress()完成運行中找到。相反,它繼續並立即重新添加btn-primary。試試這個:

$('.controls a[data-attr="editEmailAddress"]').on('click', function (e) { 
    e.preventDefault(); 
    if ($(this).hasClass("btn-primary")) { 
     updateEmailAddress(); 
     return; // note this addition 
    } else { 
     hideSuccess(); 
    } 
    $(this).addClass("btn-primary"); // if you don't return, this gets called right after .removeClass(...) 
    $(this).find('i').addClass("icon-white icon-edit").addClass('icon-ok'); 
    $(this).siblings('input[type=text]').attr('disabled', false); 
});