应用中按钮需点击两次才触发列更新问题求助（附代码）

嘿，我一眼就揪出你这个“点击两次才生效”的问题根源了！你的代码逻辑犯了一个典型的事件绑定错误：

为什么需要点击两次？ #

你在HTML按钮里写了onclick="EmpUpdate()"，但EmpUpdate函数里又给按钮绑定了一次click事件监听——第一次点击按钮时，其实只是执行了EmpUpdate，给按钮挂上了点击回调，但这次点击并没有触发这个回调；第二次点击才会真正触发绑定好的AJAX请求，这就是为什么得点两次才生效！

另外还有个小错误：你的JS选择器$("UpdateBtn")少了个点，类选择器应该是$(".UpdateBtn")，不过这个不是主要问题，但也得修正。

修复方案（两种可选） #

方案1：移除onclick，用jQuery直接绑定事件（推荐）

这种方式更符合jQuery的事件绑定规范，页面加载完成就把事件绑定好，点击一次就生效。

修改后的HTML：

<td><button class="UpdateBtn">Update</button></td>

修改后的JS：

// 确保DOM加载完成后再绑定事件
$(document).ready(function() {
    $(".UpdateBtn").on('click', function () { 
        var currentRow = $(this).closest("tr"); 
        var col1 = currentRow.find("td:eq(0)").html(); 
        var col2 = currentRow.find("td:eq(1)").html(); 
        var data = [col1, col2]; 
        
        $.ajax({ 
            async: true, 
            // 注意去掉参数之间的空格，避免参数值异常
            url: "Home/EmpUpdate?empName=" + col1 + "&empId=" + col2, 
            cache: false, 
            dataType: "json", 
            // 把参数名改成responseData，避免和外面的data变量重名混淆
            success: function (responseData) { 
                receiveResponse(responseData); 
            } 
        }); 
        console.log(data); 
    });
});

方案2：保留onclick，直接执行逻辑（适合不想改绑定方式的场景）

如果一定要保留HTML里的onclick，那就要把按钮元素传到函数里，直接在函数内执行AJAX逻辑，不要再绑定事件：

修改后的HTML：

<td><button class="UpdateBtn" onclick="EmpUpdate(this)">Update</button></td>

修改后的JS：

function EmpUpdate(btn) { 
    // 通过传入的btn参数获取当前行
    var currentRow = $(btn).closest("tr"); 
    var col1 = currentRow.find("td:eq(0)").html(); 
    var col2 = currentRow.find("td:eq(1)").html(); 
    var data = [col1, col2]; 
    
    $.ajax({ 
        async: true, 
        url: "Home/EmpUpdate?empName=" + col1 + "&empId=" + col2, 
        cache: false, 
        dataType: "json", 
        success: function (responseData) { 
            receiveResponse(responseData); 
        } 
    }); 
    console.log(data); 
}

额外注意点 #

• 记得去掉URL参数里的空格（你原来的&前面有个空格），否则empId参数可能会带空格，导致后端接收异常。
• AJAX成功回调里的参数名尽量不要和外部变量重名，避免变量作用域混淆。

内容的提问来源于stack exchange，提问作者J. Raj