添加/单击c#asp.netmvc5后禁用和更改按钮图标

disable and change button icon after added/clicked c# asp .net mvc5

本文关键字：按钮 图标 单击 c#asp netmvc5 添加      更新时间：2023-09-26

单击/添加对象后，我想更改按钮图标并禁用按钮。我想用javascript来完成这个处理。

像这样的东西：

--javascript--

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

--查看-->

@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中。

有人能告诉我怎么了吗？

感谢

尝试更改

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

至

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

禁用按钮：

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

要禁用该按钮，请尝试以下操作：

$('#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);
});

或

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