Razor按钮添加disabled类后点击判断异常，点击禁用按钮弹出启用提示

核心问题分析 #

你遇到的问题主要有两个关键点：

1. 重复ID导致选择错误：表格每行的按钮都用了id="mybtn"，HTML中ID必须唯一，$("#mybtn")只会选中页面中第一个按钮，无法正确判断当前点击按钮的状态。
2. 判断逻辑依赖全局选择器：函数中通过ID获取按钮，而非当前点击的按钮实例，导致判断结果与实际点击的按钮不匹配。

修复方案 #

1. 修改按钮代码（移除重复ID，传入当前按钮实例） #

去掉重复的id="mybtn"（表格每行按钮ID不能重复），并在onclick中传入当前按钮对象this：

<button type="button" class='btn @(value != "" ? "disabled" : "")' 
    onclick='myfunction(this)'>

2. 调整JavaScript函数（判断当前按钮的类） #

修改函数，接收传入的按钮实例，直接判断该按钮是否包含disabled类：

function myfunction(btn) {
    if ($(btn).hasClass("disabled")) {
        alert("disabled");
    } else {
        alert("enabled");
    }
}

额外检查：确认Razor条件逻辑 #

请确认value != "" ? "disabled" : ""是否符合你的业务需求：

• 这段代码表示当value不为空时，按钮添加disabled类（禁用状态）
• 如果你的需求是value为空时禁用按钮，需要将条件改为：

  class='btn @(value == "" ? "disabled" : "")'
  

可选：原生禁用按钮（可选） #

如果希望浏览器原生阻止禁用按钮的点击事件（此时不会触发onclick），可以同时添加disabled属性：

<button type="button" class='btn @(value != "" ? "disabled" : "")' 
    @(value != "" ? "disabled" : "")
    onclick='myfunction(this)'>

注：添加原生disabled属性后，禁用状态的按钮不会触发点击事件，也就不会弹出提示，根据你的需求选择是否添加。

内容的提问来源于stack exchange，提问作者th3answer