Home > Web Front-end > JS Tutorial > body text

A brief analysis and solutions to Ajax synchronization and asynchronous issues

亚连
Release: 2018-05-22 17:12:32
Original
1999 people have browsed it

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);
}
});
Copy after login

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&&currentPage!=1){
currentPage = currentPage - 1;
}
var para = {
mypara :currentPage,
startPage : currentPage,
};
$('p.page-box').data('myPage').setOptions({data: para});
}
  } 
 });
Copy after login

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&&currentPage!=1){
// currentPage = currentPage - 1;
// }
// var para = {
// mypara :currentPage,
// startPage : currentPage,
// };
// $('p.page-box').data('myPage').setOptions({data: para});
// }
// });
// $.ajaxSettings.async = true;
Copy after login

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!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!