Avoidrepeatsubmit-avoid repeated requests from the client through JavaScript

When the access pressure increases after a web project is launched, the processing speed is often much slower than that in the test environment. When a user clicks the page control and submits a request for half a day, the user repeatedly clicks the control, causing repeated request submission. Many problems are exposed at this time. The previous project was developed using Asp.net + C #. To avoid repeated submission issues, we have made some improvements in a previous JS version. Although the technology is more traditional, but it can still be used as an emergency.

The path submitted by the Asp.net client is divided into the following:

• A) Click button to submit-> form's onsubmit event
  B) Click "Submit"-> "webform_dopostbackwithoptions" of the button-> "webform_onsubmit" of the form (including the custom submit event)
• C) Click button-> _ dopostback-> RUN onsubmit-> submit of the form.
  D) Click button-> webform_dopostbackwithoptions-> _ dopostback-> onsubmit (webform_onsubmit) of the running form-> submit

 

This JSCodeAs follows:

 Code //---------------------------------------------------------  // Author: jasson http://qguohog.cnblogs.com  // Date: 2010-12-18  // Function: avoid repeated data submission. If a button control does not need to enable repeated submission,  // Add the attribute avoidrepeatsubmit = "false" to it"  //--------------------------------------------------------- $ (Document). Ready (function () {var isposting = False ; Var divmask = Null ; Var divtipcontent = Null ; Var formonsubevts = New Object (); var submitbyclickctrl = Null ; Function _ dopostback (){}; If ( Typeof (_ Dopostback) =" Function ") {_ Dopostback = _ dopostback; _ dopostback = _ dopostbacknew;} function _ dopostbacknew (sender, argS ){ Try {Submitbyclickctrl = $ (" # "+ Sender );} Catch (E ){ Try {Submitbyclickctrl = $ ("# "+ Sender. Replace ('$ ','_'));} Catch (Ex) {submitbyclickctrl = Null ; }}_ Dopostback (sender, argS);} function createlayermask (){ If (Divmask = Null ) {Divmask = $ (" <Div tabindex = '0'> </div> "); $ (Divmask). addclass (" Arsmask "); $ (Document. Body). append (divmask); bindevents (divmask) ;}} function createtipcontent (){If (Divtipcontent = Null ) {Divtipcontent = $ (" <Div> </div> "); $ (Divtipcontent). addclass (" Arstipcontent "); $ (Document. Body). append (divtipcontent); bindevents (divtipcontent) ;}} function bindevents (divobj) {$ (divobj). Blur (function (){ This . Focus () ;}); $ (divobj). BIND (" Drag ", Function (){ Return   False ;}); $ (Divobj). BIND ("Selectstart ", Function (){ Return   False ;}); $ (Divobj). BIND (" Contextmenu ", Function (){ Return   False ;}); $ (Divobj). BIND (" Focus ", Function (){ This . Blur () ;});} function setlocation () {specify umentelement. scrolltop + document.doc umentelement. clientheight); Specify umentelement. scrollleft + document.doc umentelement. clientwidth); annotate ("Left ", Document.doc umentelement. scrollleft + (document.doc umentelement. clientwidth-$ (divtipcontent). Width ()/2); expires (divtipcontent).css (" Top ", Document.doc umentelement. scrolltop + (document.doc umentelement. clientheight-$ (divtipcontent ). height ()/2);} function showmaskandtipcontent (isshow) {isposting = isshow; createlayermask (); createtipcontent (); If (Isshow) {setprogressinfo (); $ (divmask). Show (); $ (divtipcontent). Show (); setlocation (); $ (window). BIND (" Scroll ", Setlocation); $ (window). BIND (" Resize ", Setlocation );} Else {$ (Divmask). Hide (); $ (divtipcontent). Hide (); $ (window). Unbind (" Scroll ", Setlocation); $ (window). Unbind (" Resize ", Setlocation) ;}} function setprogressinfo (text, width, height ){ If (Divtipcontent! = Null ) {Protext = text |" Processing... please wait... "; Prowidth = width | 140; proheight = height | 40; expires (divtipcontent).html (protext); $ (divtipcontent ). width (prowidth); $ (divtipcontent ). height (proheight) ;}} function useavoidrepeatsubmit (CTL) {var avoid =$ (CTL ). ATTR (" Avoidrepeatsubmit "); Return ( Typeof (Avoid) =" Undefined "| Avoid. tolowercase ()! =" False ") ;}$ (" Input [type = submit], input [type = image] "). Click (function () {submitbyclickctrl =This ;}); $ (" Form "). Each (function () {var esubmit = This . Onsubmit; If ( Typeof ( This . Onsubmit) =" Function ") {Formonsubevts [$ ( This ). ATTR (" Name ")] = Esubmit; This . Onsubmit = Null ;} This . Onsubmit = function (e) {var EVT = E | window. Event ; If (Isposting & EVT! = Null ){ Return EVT. returnvalue =! (EVT. cancelbubble = True );} Var esubmit = formonsubevts [$ ( This ). ATTR (" Name ")]; If (Typeof (Esubmit) =" Function "&&! Esubmit ()){ Return   False ;} If (Submitbyclickctrl! = Null ){ If (Useavoidrepeatsubmit (submitbyclickctrl) {showmaskandtipcontent ( True );}} Return   True ;}});});

The effect is as follows:

Download DEMO code: Avoidrepeatsubmit.