如何避免ASP.NET按钮在ConfirmBox确认后重复触发点击事件

你的问题核心在于两个点：一是异步触发按钮点击时会再次执行OnClientClick事件，二是页面回发后客户端变量isButtonClicked会被重置为false，导致重复触发。以下是两种可行的修复方案：

方案一：临时移除客户端点击事件，避免循环触发 #

修改JavaScript函数，在确认后触发按钮点击前，先移除按钮的OnClientClick属性，这样第二次点击就不会再调用showConfirmBox：

<asp:Button ID="myButton" runat="server" Text="Click Me" OnClientClick="return showConfirmBox();" OnClick="myButton_Click" />
<script type="text/javascript">
    function showConfirmBox() {
        var btn = document.getElementById('<%= myButton.ClientID %>');
        // 如果已经触发过确认，直接允许提交
        if (btn.getAttribute('data-confirmed') === 'true') {
            return true;
        }

        setTimeout(function() {
            if (confirm('Are you sure you want to proceed?')) {
                // 标记已确认状态
                btn.setAttribute('data-confirmed', 'true');
                // 移除客户端点击事件，避免循环触发
                btn.onclick = null;
                btn.removeAttribute('onclick');
                // 触发按钮点击提交
                btn.click();
            } else {
                // 用户取消，清除确认标记
                btn.removeAttribute('data-confirmed');
            }
        }, 1000);
        // 阻止按钮立即提交
        return false;
    }
</script>

方案二：使用HiddenField保存状态，解决回发后重置问题 #

如果需要在页面回发后依然保持状态控制，可以添加一个服务器端HiddenField来存储确认状态：

<asp:HiddenField ID="hdnConfirmed" runat="server" Value="false" />
<asp:Button ID="myButton" runat="server" Text="Click Me" OnClientClick="return showConfirmBox();" OnClick="myButton_Click" />
<script type="text/javascript">
    function showConfirmBox() {
        var hdn = document.getElementById('<%= hdnConfirmed.ClientID %>');
        var btn = document.getElementById('<%= myButton.ClientID %>');

        // 如果已经确认过，直接提交
        if (hdn.value === 'true') {
            return true;
        }

        setTimeout(function() {
            if (confirm('Are you sure you want to proceed?')) {
                // 设置HiddenField为已确认状态
                hdn.value = 'true';
                // 移除客户端点击事件
                btn.onclick = null;
                btn.removeAttribute('onclick');
                btn.click();
            } else {
                hdn.value = 'false';
            }
        }, 1000);
        return false;
    }
</script>

服务器端补充处理（可选） #

如果需要在服务器端处理完业务后重置状态，允许下次点击重新触发确认，可以在myButton_Click事件中添加：

protected void myButton_Click(object sender, EventArgs e)
{
    // 执行你的业务逻辑
    // 重置确认状态，允许下次点击触发确认框
    hdnConfirmed.Value = "false";
}

关键逻辑说明 #

• 移除OnClientClick事件：彻底避免触发按钮点击时再次进入showConfirmBox函数，打破循环触发的链条。
• 状态标记：使用data-confirmed属性或HiddenField保存确认状态，区分首次点击和确认后的提交操作。
• 回发状态保留：HiddenField的值会随页面回发同步到服务器，因此回发后客户端仍能读取到正确的状态，不会因为页面重渲染丢失标记。

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