Solution to page flickering caused by asynchronous request based on JQuery's $.ajax method_jquery

scenario

currently, there is a need to fill in the content in the text box and automatically trigger the keyup event. the drop-down list will automatically filter the corresponding options. however, after using $,ajax, i found that every time the event is triggered, the entire web page will flash. global ajax event triggered

code snippet

$.ajax({ 
type: "POST", 
url: root + "/xxx, 
data: requestData, 
dataType: "json", 
success: function(data){ 
// 清空列表 
$("#formOpinion #listLeft").empty(); 
$.each(data, 
function(i, $data) { 
var $option = $("<option name='opinion.tag' value=" 
+ $data.code + $data.name + ">" + $data.code 
+ $data.name + "</option>"); 
// 绑定数据到listLeft 
$("#formOpinion #listLeft").append($option); 
}); 
} 
}); 

solution

looking at the jquery api documentation, we found that there is a global property in $.ajax that can set whether the ajax event is global. the default is true, change it to false

the above content is the solution introduced by the editor to solve the problem of page flickering caused by asynchronous requests based on jquery's $.ajax method. i hope it will be helpful to everyone!