防止重复提交

方法一:

javascript 防止重复提交
很多时候我们都需要防止重复提交,这方面的文章也比较多,实现的途径差别也很大.以下是我写的一种控制提交的方式.因为有些时候即使服务器能够识别重复的提交,也会造成问题.比如需要很长等待时间的操作,在首次提交后,不断重复提交,页面可能会死掉.用脚本来控制的话可以防止这种问题.当然也可以脚本和服务器都进行控制,这样就比较完美了.
    闲话少说,将以下脚本放置于页面顶部.

 1document.IsPosted = false;
 2function CancelDubSubmit()
 3{
 4    if ((typeof(event.returnValue) == "undefined" || event.returnValue== true) && !document.IsPosted)
 5    {
 6        document.IsPosted = true;
 7        event.returnValue = true;
 8    }
 9    else
10    {         
11        event.returnValue = false;
12    }
13}
以下加粗部分放置于form标签中,如果你已经有了onsubmit事件的其他执行函数,可以放在一起,最好将CancelDubSubmit()函数放在最后.
<form id="Form1" οnsubmit="CancelDubSubmit();" method="post" runat="server">
    其中document.IsPosted是为了记录是否回送.一旦页面回送,document.IsPosted将为true. 重新加载后,document.IsPosted=false将被执行.当onsubmit事件没有其他执行函数或者其他执行函数返回true并且document.IsPosted=false时,回送页面,否则停止回送.
    以上方法不能控制使用 function __doPostBack() 函数的服务器端控件.因为在此函数中的提交是靠 document.Form1.submit() 实现的,它不会触发Onsubmit事件.那么我们还需要重写__doPostBack() 函数.
function __doPostBack(eventTarget, eventArgument) {
    if (!document.IsPosted)
        {
        var theform;
        if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {
            theform = document.forms["Form1"];
        }
        else {
            theform = document.Form1;
        }
        theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
        theform.__EVENTARGUMENT.value = eventArgument;   
       
        document.IsPosted = true;
        theform.submit();
        }
    }
请将以上代码放置于页面的原__doPostBack() 函数之后. 

 

方法二:

学习ASP.NET时写的防止重复提交的脚本(二)
[ 2005-07-11 15:18:23 | 作者: admin ]
字体大小: 大 | 中 | 小
 内容是:

function _doPostBack(){};
if(typeof("__doPostBack")=="function")
{
 _doPostBack=__doPostBack;
 __doPostBack=_doPostBackNew;
}

document.attachEvent("onmousemove",_onmousemove);
var _isPosting=false;
var _divMask=null;

function _onmousemove()
{
 if(_divMask)
 with(_divMask.runtimeStyle)
 {
  left=event.clientX+document.body.scrollLeft-4;
  top=event.clientY+document.body.scrollTop-4;
 }
}


function _makeMask()
{
 var div=document.createElement("DIV");
 with(div.runtimeStyle)
 {
  position="absolute";
  zIndex=999999;
  fontSize="1px";
  left=event.clientX+document.body.scrollLeft-4;
  top=event.clientY+document.body.scrollTop-4;
  width="8px";
  height="8px";
  cursor="wait";
 
  backgroundColor="gray";
  filter="alpha(opacity=10)";
 }
 try
 {
  document.body.insertAdjacentElement("BeforeEnd",div);
  div.οnblur=new Function("this.focus()");
  div.focus();
 }
 catch(x){}
 
 if(_divMask)_divMask.removeNode(true);
 _divMask=div;
}

function _doPostBackNew(sender,args)
{
 if(_isPosting)
  return event.returnValue=!(event.cancelBubble=true);

 status="正在更新页面...";
 _doPostBack(sender,args); 
 _isPosting=true;
 _makeMask();
}

function _onformsubmit()
{
 if(_isPosting)
  return event.returnValue=!(event.cancelBubble=true);

 _isPosting=true;
 _makeMask();
}
new function _attachForms()
{
 with(new Enumerator(document.forms))
 for(;!atEnd();moveNext())
 {
  item().attachEvent("onsubmit",_onformsubmit);
  var div=document.createElement("div");
  div.runtimeStyle.width="0px";
  div.runtimeStyle.hight="0px";
  div.runtimeStyle.overflow="hidden";
  div.runtimeStyle.position="absolute";
  item(0).insertAdjacentElement("afterbegin",div);
  div.innerHTML="<INPUT id=webformpatchsubmitelement οnclick='return event.returnValue=false' type=submit value=webformpatchsubmitelement name=webformpatchsubmitelement>";
 }
}

把这个作为 〈-script src=.....js-〉〈-/script-〉 的形式Render到每个页面中就可以了。|
如果有PageBase,则在Init的时候用RegisterClientScriptBlock放上去更好。
因为客户没有抱怨过,所以也没有改进过

方法三:

function submitonce(theform)
 {
  
  if (document.all||document.getElementById)
  {
   for (i=0;i<theform.length;i++)
   {
    var tempobj=theform.elements[i];
    if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset")
    {
    tempobj.disabled=true;
    }
   }
  }
 }

<form id="Form1" method="post" runat="server" οnsubmit="submitonce(this);">

个人认为方法三比较简单实用

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值