Home  >  Article  >  Web Front-end  >  A brief analysis and solutions to Ajax synchronization and asynchronous issues

A brief analysis and solutions to Ajax synchronization and asynchronous issues

亚连
亚连Original
2018-05-22 17:12:321840browse

When sending and receiving data to the background through ajax, synchronization and asynchronous problems often occur. This article will introduce to you a brief analysis of Ajax synchronization and asynchronous issues. Friends who need it can refer to

When sending and receiving data to the background through ajax, synchronization and asynchronous issues often occur. Since ajax is loaded asynchronously by default, but sometimes synchronization or synchronization effects are needed, there are the following two solutions.

Option 1: Put certain methods in the callback function to execute, that is, wait until successful return from the background before executing.

Example:

$.getJSON("/data-access/sens-config/IPandPortSel",{},function(resp){
if(resp.code==0){
$.each(resp.data,function(i,obj){
option_net_type += addOption(obj);
});
$("#edit-addr_id").append(option_net_type);
addr_idOld = $('#edit-addr_id').val(addr_id);
}
});

The red part must be executed after the data is returned successfully. If it is placed outside if(resp.code==0){} ((but Put it after $.getJSON();) there will be a situation where the red part of the code has been executed before the data is returned from the background.

Method 2: Use the standard ajax delivery method

 $.ajax({ 
  type : "post", 
  url : "/data-access/manufacturer/deleteBranch", 
  data : data, 
  async : false,//取消异步 
  success : function(resp){
if(resp.code==0){
if(ids.length>=currentListNum&¤tPage!=1){
currentPage = currentPage - 1;
}
var para = {
mypara :currentPage,
startPage : currentPage,
};
$('p.page-box').data('myPage').setOptions({data: para});
}
  } 
 });

Note: This method is only a local synchronous transmission method and will not affect other transmissions. It is safer and recommended. A

way.

There is another way:

// $.ajaxSettings.async = false;
// $.getJSON("/data-access/ip-config/deleteBranch",data,function(resp){
// if(resp.code==0){
// if(ids.length>=currentListNum&¤tPage!=1){
// currentPage = currentPage - 1;
// }
// var para = {
// mypara :currentPage,
// startPage : currentPage,
// };
// $('p.page-box').data('myPage').setOptions({data: para});
// }
// });
// $.ajaxSettings.async = true;

This way is global, not very It is recommended to use it because it will affect other ajax transmissions.

I compiled the above for everyone, I hope it will be helpful to everyone in the future.

Related articles:

Detailed explanation of position: fixed problem in IE6

Detailed explanation of !important, *, _ symbols in CSS styles

padding production Image adaptive layout (CSS percentage)

The above is the detailed content of A brief analysis and solutions to Ajax synchronization and asynchronous issues. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn