页面双表单（JQuery动态+ASP.NET）按钮点击事件重复加载问题

听起来你遇到的是两个按钮的验证逻辑被重复触发的问题，我来帮你梳理下可能的原因和解决办法：

核心问题分析 #

大概率是你绑定事件的方式没精准定位到单个按钮，或者事件绑定被重复执行了。比如如果用了宽泛的选择器（比如$('input[type="button"]').click(...)），会同时选中两个按钮，导致同一个逻辑触发两次；或者动态生成按钮时，事件绑定代码被多次执行，给同一个按钮绑了多次事件。

针对性解决方案 #

1. 给动态生成的按钮单独绑定事件 #

生成按钮后，直接给这个新创建的元素绑定事件，不要用全局选择器：

// 生成按钮
var s = $(' <input type="button" ID="btnFrmSubmit" runat="server" Text="Submit" value="FrmSubmit" />');
// 直接给这个按钮绑定验证逻辑
s.click(function() {
    // 你的动态按钮验证代码
    console.log("动态按钮触发验证");
});
// 再添加到页面
$("#mainTbl").after(s);

这样只会给这个动态生成的按钮绑定一次事件，不会影响ASP.NET的那个按钮。

2. 精准绑定ASP.NET的静态按钮 #

ASP.NET的服务器控件在前端渲染时，客户端ID可能会被自动修改（比如带容器前缀），所以最好用ClientID来获取正确的前端ID，避免选择器失效：

$(document).ready(function() {
    // 用ASP.NET控件的ClientID定位按钮
    $("#<%= btnFrmSubmitn.ClientID %>").click(function() {
        // 你的静态按钮验证代码
        console.log("ASP.NET按钮触发验证");
    });
});

如果你的按钮没有在命名容器里（比如没在MasterPage或Panel的命名容器中），直接用#btnFrmSubmitn也可以，但用ClientID更稳妥。

3. 避免事件重复绑定 #

如果你的动态按钮生成代码可能被多次执行（比如用户多次触发生成动作），可以先解绑原有事件再绑定，防止同一个按钮绑多次事件：

s.off('click').click(function() {
    // 验证逻辑
});

或者用one()方法，让事件只触发一次：

s.one('click', function() {
    // 验证逻辑
});

4. 用事件委托时精准区分按钮 #

如果因为某些原因必须用事件委托（比如动态元素在绑定事件后才被添加到DOM），一定要用精准的选择器区分两个按钮：

// 给动态按钮绑定委托事件
$(document).on('click', '#btnFrmSubmit', function() {
    // 动态按钮验证逻辑
});

// 给ASP.NET按钮绑定委托事件
$(document).on('click', '#<%= btnFrmSubmitn.ClientID %>', function() {
    // 静态按钮验证逻辑
});

按照上面的方法调整后，两个按钮的验证逻辑应该就能各自独立触发，不会出现重复加载的问题啦。

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