Javascript jqueryajax函数被多次调用,但数据只在第一次调用时才被提取
我有一个jQuery函数,用于从flask服务器上的XML文件中提取数据。我从调用这个函数开始我的ready函数,我所有的变量都更新了,没有问题。但是,当我从单击操作第二次调用函数时,我的变量不会更新。我知道AJAX函数正在成功调用,因为我收到了警报。第一次调用后,似乎没有重新加载XML文档。如何在每次调用函数时更新变量 全局变量Javascript jqueryajax函数被多次调用,但数据只在第一次调用时才被提取,javascript,jquery,ajax,xml,Javascript,Jquery,Ajax,Xml,我有一个jQuery函数,用于从flask服务器上的XML文件中提取数据。我从调用这个函数开始我的ready函数,我所有的变量都更新了,没有问题。但是,当我从单击操作第二次调用函数时,我的变量不会更新。我知道AJAX函数正在成功调用,因为我收到了警报。第一次调用后,似乎没有重新加载XML文档。如何在每次调用函数时更新变量 全局变量 //Variables representing Sensor Data var bspeed=0; var set_temp=0; var f_temp=0; va
//Variables representing Sensor Data
var bspeed=0;
var set_temp=0;
var f_temp=0;
var fuel_level=0;
var s_temp=0;
var humidity=0;
var bspeed_data=0;
var set_temp=0;
var mode = "mod";
var mod_mode = "blower";
数据拉取功能
//AJAX XML file parsing
function pull_data(){
//Gather Data from main.xml and store into variables
$.ajax({
type: "GET",
url: "static/main.xml",
async: false,
success: function(xml){
$(xml).find('item').each(function(){
var id = $(this).find('id').text();
switch(id){
case "ftemp_data":
f_temp = $(this).find('value').text();
break;
case "stemp_data":
s_temp = $(this).find('value').text();
break;
case "fuel_level_data":
fuel_level = $(this).find('value').text();
break;
case "humidity_data":
humidity = $(this).find('value').text();
break;
case "blower_speed":
alert("Changing bspeed");
bspeed_data = $(this).find('value').text();
}
});
alert("Pull Success "+ bspeed_data);
},
error: function(data){
alert("AJAX failed: "+ data.status + ' ' + data.statusText);
}
});
//Populate HTML with variables
$("#ftemp_data").text(f_temp+("\u00B0"));
$("#stemp_data").text(s_temp+("\u00B0"));
$("#fuel_level_data").text(fuel_level+"%");
$("#humidity_data").text(humidity+"%");
$("#bspeed_data").text(bspeed_data);
}
就绪功能(简化)
我对web开发还比较陌生,所以请随意指出我所做工作的结构问题 我认为您正在获得缓存响应,您需要向url添加时间戳
var date = new Date();
var timestamp = date.getTime();
$.ajax({
type: "GET",
url: "static/main.xml?="+timestamp
})
可能需要强制刷新缓存,为此,请在ajax代码中添加属性cache:false:
$.ajax({
type: "GET",
url: "static/main.xml",
async: false,
cache: false,...
您可以签入看起来您在成功的请求回调中更新变量的值,但是在AJAX函数外部调用了更新文本表示的代码。这意味着调用函数时,会发出AJAX请求,并且在请求完成之前会更新DOM。更新变量后,需要将DOM更新逻辑移动到$.ajax的成功处理程序中
您似乎得到了一个缓存响应。您应该在请求选项中使用cache:false
,但我也建议删除async:false
选项,因为您仍然使用回调来更新变量的值。以下是更新的代码:
//AJAX XML file parsing
function pull_data(){
//Gather Data from main.xml and store into variables
$.ajax({
type: "GET",
url: "static/main.xml",
async: false,
success: function(xml){
$(xml).find('item').each(function(){
var id = $(this).find('id').text();
switch(id){
case "ftemp_data":
f_temp = $(this).find('value').text();
break;
case "stemp_data":
s_temp = $(this).find('value').text();
break;
case "fuel_level_data":
fuel_level = $(this).find('value').text();
break;
case "humidity_data":
humidity = $(this).find('value').text();
break;
case "blower_speed":
alert("Changing bspeed");
bspeed_data = $(this).find('value').text();
}
});
alert("Pull Success "+ bspeed_data);
//Request was successful, populate HTML with variables
$("#ftemp_data").text(f_temp+("\u00B0"));
$("#stemp_data").text(s_temp+("\u00B0"));
$("#fuel_level_data").text(fuel_level+"%");
$("#humidity_data").text(humidity+"%");
$("#bspeed_data").text(bspeed_data);
},
error: function(data){
alert("AJAX failed: "+ data.status + ' ' + data.statusText);
}
});
}
您还可以将Ajax函数的cache选项设置为false
{cache:false}
将有所帮助,但首先,删除async:false
再次查看代码,我发现您已经设置了async:false
,因此,如果这样做是正确的,那么将更新移动到成功处理程序中可能不是解决方案,因为理论上您应该在调用下一行之前获得更新的值。您强制此调用同步有什么特殊原因吗?您的问题可能确实是响应被缓存了。在这种情况下,您应该尝试使用@cris_dpa的响应中提到的cache:false
。
//AJAX XML file parsing
function pull_data(){
//Gather Data from main.xml and store into variables
$.ajax({
type: "GET",
url: "static/main.xml",
async: false,
success: function(xml){
$(xml).find('item').each(function(){
var id = $(this).find('id').text();
switch(id){
case "ftemp_data":
f_temp = $(this).find('value').text();
break;
case "stemp_data":
s_temp = $(this).find('value').text();
break;
case "fuel_level_data":
fuel_level = $(this).find('value').text();
break;
case "humidity_data":
humidity = $(this).find('value').text();
break;
case "blower_speed":
alert("Changing bspeed");
bspeed_data = $(this).find('value').text();
}
});
alert("Pull Success "+ bspeed_data);
//Request was successful, populate HTML with variables
$("#ftemp_data").text(f_temp+("\u00B0"));
$("#stemp_data").text(s_temp+("\u00B0"));
$("#fuel_level_data").text(fuel_level+"%");
$("#humidity_data").text(humidity+"%");
$("#bspeed_data").text(bspeed_data);
},
error: function(data){
alert("AJAX failed: "+ data.status + ' ' + data.statusText);
}
});
}