如何使用JavaScript启用/禁用用作按钮的锚标签？

步骤1：给锚标签添加ID（精准选择元素） #

先修改HTML，给用作按钮的<a>标签加上唯一ID，避免选择错误：

<div class="row my-2 text-right">
    <div class="col-12">
        <a id="saveQuoteBtn" href="javascript:saveQuote();" class="btn btn-primary">Save Quote</a>
    </div>
</div>

步骤2：在AJAX回调中控制按钮状态 #

利用jQuery（和你现有代码的技术栈匹配）修改按钮的样式与点击行为，实现启用/禁用效果：

function getS2List(b2, callback) {
    $.ajax({
        url: "/ajax/url/" + b2,
        type: "GET",
        async: false,
        success: function(response) {
            const saveBtn = $('#saveQuoteBtn');
            // 检查activeCustomer数组中是否存在'Y'（优化原循环逻辑，避免重复覆盖状态）
            const shouldDisable = response.activeCustomer.some(item => item === 'Y');
            
            if (shouldDisable) {
                // 禁用按钮：添加禁用样式、阻止点击、替换无效href
                saveBtn.addClass('disabled')
                       .css('pointer-events', 'none')
                       .attr('href', 'javascript:void(0);');
            } else {
                // 启用按钮：移除禁用样式、恢复点击、还原原href
                saveBtn.removeClass('disabled')
                       .css('pointer-events', 'auto')
                       .attr('href', 'javascript:saveQuote();');
            }

            // 若你确实需要遍历每个元素逐个判断（注意：最后一次循环会覆盖之前的状态），可保留原循环：
            // for(var i = 0; i < response.activeCustomer.length; i++) {
            //     if(response.activeCustomer[i] == 'Y'){
            //         saveBtn.addClass('disabled').css('pointer-events', 'none').attr('href', 'javascript:void(0);');
            //     }else{
            //         saveBtn.removeClass('disabled').css('pointer-events', 'auto').attr('href', 'javascript:saveQuote();');
            //     }
            // }
        },
        error: function(xhr, textStatus, errorThrown) {
            alert(xhr.responseText);
            return {};
        }
    });
}

补充说明 #

<a>标签没有原生disabled属性，所以需要从两方面实现禁用效果：

• 样式层面：添加Bootstrap的disabled类让按钮外观变灰，设置pointer-events: none阻止鼠标点击
• 行为层面：替换href为无效值，防止通过键盘或直接触发href执行代码

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