- If the submission object is a button, you can set the button to disabled, this method is suitable for button submission, this approach is simple and rough, but also a lot of people use the way, the following:
//set the button to Disabled after the button is committed and before Ajax commits$ ("Input[type=submit]"). attr (' disabled '),true) $.ajax ({URL:'/post.php 'Data:{a:1,b,1} success:function(){ //re-enable the button after the commit is successful$ ("Input[type=submit]"). attr (' disabled '),false)}, Error:function(){ //even if Ajax fails, you need to set the button to the available state, because it could be a failure caused by a network problem, so you need to set the button to be available$ ("Input[type=submit]"). attr (' disabled '),false) }})
- Non-button Object submission
Sometimes we do not have the from when we submit the data, only a single form component (input, textarea, radio, checkbox, etc.), so we can set any object to commit to complete the commit, Because ordinary objects do not have disabled properties, we need to use other means to prevent duplicate submissions
//set an object to control whether or not to enter the AJAX processvarPost_flag =false; functionpost () {//return directly if you are committing, stop execution if(Post_flag)return; //mark the current status as being committedPost_flag =true; $.ajax ({//Enter the AJAX submission processURL: '/post.php 'Data:{a:1,b,1} success:function() {Post_flag=false;//mark a flag as a committed state after a successful commit}, Error:function() {Post_flag=false;//AJAX failures also require flags to be marked as a committed state } })}
Summary of methods of Ajax anti-duplication submission