添加/點擊後禁用並更改按鈕圖標c＃asp.net mvc5

Question

我想更改按鈕圖標並在點擊/添加對象後禁用按鈕。 我以爲使用JavaScript來完成這個處理。

是這樣的：

--javascript--

$('#catBut').click(function(){ 
    $(this).find('span') 
     .toggleClass('glyphicon glyphicon-plus') 
     .toggleClass('glyphicon glyphicon-ok'); 
    }) 

;

--view--

@using (Html.BeginForm("Add", "VerlangLijst", new { naam = materiaal.Naam }, FormMethod.Post)) 
{ 
    <button id="catBut" type="submit" class="btn btn-default"> 
     <span class="glyphicon glyphicon-plus"></span> 
    </button> 
} 

但不知何故，這是行不通的。我已將新的.js文件添加到bundleConfig。

有人可以告訴我什麼是錯？

感謝

Answer 1

試着將

$(this).find('span').toggleClass('glyphicon glyphicon-plus').toggleClass('glyphicon glyphicon-ok'); 

到

$(this).find('span').addClass('glyphicon-ok').removeClass('glyphicon-plus'); 

要禁用按鈕：

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

Answer 2

要禁用按鈕，你可以試試：

$('#catBut').click(function(){ 
    $(this).find('span').toggleClass('glyphicon-plus').toggleClass('glyphicon-ok'); 
    $('#catBut').prop("disabled", true); 
}); 

這將從按鈕中刪除「加號」圖標，添加「ok」圖標並在按鈕「catBut」上設置disabled = true，因此將其禁用。

你也可以嘗試（如果上述方法無效）：

$(document).on("click", "#catBut", function(){ 
    $('#catBut').find('span').removeClass('glyphicon-plus').addClass('glyphicon-ok'); 
    $('#catBut').prop("disabled", true); 
}); 

OR

$(document).on("click", "#catBut", function(){ 
    $('#catBut').find('span').toggleClass('glyphicon-plus').toggleClass('glyphicon-ok'); 
    $('#catBut').prop("disabled", true); 
});