注册或者点击按钮时,防止用户重复提交数据

 

asp.net实现点击按钮后设按钮不可用并提交

<asp:Button ID="Button1" runat="server" Text="123456" OnClientClick="this.disabled=true;this.form.submit(); "  UseSubmitBehavior= "False"  οnclick="Button1_Click" />


客户端加载的时候,重新将这个操作再启动

    <script language="javascript" type="text/javascript">
        function controlButton(flag) {
            var btnObj = document.getElementById("Button1");
            btnObj.disabled = flag;    
        }
       
    </script>
</head>
<body οnlοad="controlButton(false);">

后台代码:

protected void Button1_Click(object sender, EventArgs e)
        {
            Thread.Sleep(3000);
            Response.Write("123213<br>");
            Response.Write("123213<br>");
            Response.Write("123213<br>");
        }

如果页面按钮很多,那么可以采用另一种方式:

后台page_load代码:

this.BtnSend.Attributes.Add("onclick", this.GetPostBackEventReference(this.BtnSend) + ";this.disabled=true; ");


前台button的代码:
 

 <asp:button id="BtnSend" runat="server" Width="80px" ForeColor="White" 
                Text="发送" BackColor="#376091" BorderColor="#FFFFFF" Font-Bold="True" 
                style="height: 24px" Font-Size="13px" BorderStyle="None"   OnClick="BtnSend_Click" ></asp:button>


因为控件的this.disabled设置后,控件为禁用状态,无法在回发调用后台的事件方法,所以必须用GetPostBackEventReference先进行回调后台的事件方法后,再调用disabled=true。

ASP.NET UseSubmitBehavior 属性

定义和用法

UseSubmitBehavior 属性规定按钮控件使用客户端浏览器内建的提交功能,还是使用 ASP.NET 的 postback 机制。

该属性被设置为 TRUE,如果控件使用浏览器的提交机制。否则为 FALSE。默认值是 TRUE。

当设置为 FALSE 时,ASP.NET 会添加一段客户端脚本来回传该表单。

当 UseSubmitBehavior 属性为 false 时,控件开发人员可以使用 GetPostBackEventReference 方法来返回 Button 的客户端回发事件。GetPostBackEventReference 方法返回的字符串包含客户端函数调用的文本,可以插入到客户端事件处理程序中。

语法

<asp:Button UseSubmitBehavior="TRUE|FALSE" runat="server" /> 

实例

下面的例子使用 ASP.NET 的 postback 机制:

<script runat="server">
Sub SubmitBtn(obj As Object, e As EventArgs)
  lblMsg.Text = "Submitted using the ASP.NET postback mechanism."
End Sub
</script>

<form runat="server">
Click the button:
<asp:button id="Button1" runat="server"
Text="Submit" οnclick="SubmitBtn" 
UseSubmitBehavior="FALSE" />
<br />

<asp:label id="lblMsg" runat="server"/>
</form>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端可以通过以下几种方式防止用户重复提交: 1. 禁用提交按钮:在表单被提交后,立即禁用提交按钮,防止用户多次点击提交按钮。可以通过以下代码实现: ```javascript document.querySelector('form').addEventListener('submit', function(event) { event.preventDefault(); document.querySelector('button[type="submit"]').setAttribute('disabled', true); // ... }); ``` 2. 显示加载动画:在表单被提交后,显示一个加载动画来提示用户正在处理请求,防止用户多次点击提交按钮。可以通过以下代码实现: ```javascript document.querySelector('form').addEventListener('submit', function(event) { event.preventDefault(); document.querySelector('.loading').style.display = 'block'; // ... }); ``` 3. 防抖函数:在用户频繁点击提交按钮,使用防抖函数延迟请求的发送。可以通过以下代码实现: ```javascript function debounce(fn, delay) { let timer; return function() { clearTimeout(timer); timer = setTimeout(() => { fn.apply(this, arguments); }, delay); } } const submitForm = debounce(function() { document.querySelector('form').submit(); }, 1000); document.querySelector('button[type="submit"]').addEventListener('click', function(event) { event.preventDefault(); submitForm(); }); ``` 以上是前端防止用户重复提交的一些方法,但这些方法只是针对前端的处理,为了保证数据的安全和正确性,后端也需要进行相应的处理。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值