关于使用js进行表单提交操作引发的表单重复提交问题

         现在，很多富客户端的js框架层出不穷。虽然给我们提供简单美观的UI设计，减轻了程序员的负担

，但是随之而来的也带来一些不恰当的使用可能会引发的错误操作。

1、下面举一个在使用EasyUI进行表单提交过程中出现的错误操作：

<script type="text/javascript">
$().ready(function(){
});

function newbackup(){
$('#save-new').bind('click', function(){
$('#f-new').form('submit',{
});
});
}
</script>

注：只给出核心部分，newbackup函数在调用时都会打开一个窗口，窗口内有一个id为save-now的按钮和一个id为f-new的表单，当点击save-now按钮后就会提交id为f-new的表单

错误：当页面载入后，第一次能够正常提交请求。当再次打开窗口，提交新的数据时，会发出多次重复的请求。

分析：同一个按钮，当使用Ajax方式提交请求时，由于页面没有刷新，因此不能重复为同一个按钮绑定多个相同的事件，否则则会出现上述的表单重复提交的问题。

解决方法：在页面加载完成后，就为其绑定事件（此时只绑定了一次）即:
<script type="text/javascript">
$().ready(function(){
$('#save-new').bind('click', function(){
$('#f-new').form('submit',{
});
});
});

function newbackup(){

}
</script>

或者在每次绑定之前，先对过去绑定的事件进行解绑，即
<script type="text/javascript">
$().ready(function(){

});

function newbackup(){
$('#save-new').unbind('click');
$('#save-new').bind('click', function(){
$('#f-new').form('submit',{
});
});
}
</script>

小提示：只要不为未重新载入的页面中的同一个按钮重复绑定事件，即可杜绝此类重复提交操作的发生。