$.getJSON 正确执行,但 js 标签未更新



我不是JS专家,我希望得到任何支持。 我正在尝试每 1000 毫秒更新许多标签(此处代码中的 1 个(。

我正在使用此代码:

<script type="text/javascript">
$(document).ready(function(){
$.ajaxSetup({ cache: false });
setInterval(function() {
$.getJSON("Maj_Tag_PLC.htm", function(data){
$('#watchdog').text(data.watchdog);
});
},1000);
});

这个getjson似乎有效,因为我在网络选项卡(chrome(中看到带有更新标签的"响应":

{ "watchdog" : 29304, "count" : 29304, "Etat_Lampe_Plafond_Cuisine" : 0, "Etat_Lampe_Tetes_Murs_Cuisine" : 0, "Etat_Lampe_Plafond_Salon_Rue" : 0, "Etat_Lampe_Plafond_Salon_Jardin" : 0, "Etat_Lampe_Tetes_Murs_Salon" : 0, "Temps_Restant_Plafond_Cuisine" : T#0MS, "Temps_Restant_Tetes_Murs_Cuisine" : T#0MS, "Temps_Restant_Plafond_Salon_Rue" : T#0MS, "Temps_Restant_Plafond_Salon_Jardin" : T#0MS, "Temps_Restant_Tetes_Murs_Salon" : T#0MS, "Temps_Total_Plafond_Cuisine" : T#0MS, "Temps_Total_Tetes_Murs_Cuisine" : T#0MS, "Temps_Total_Plafond_Salon_Rue" : T#0MS, "Temps_Total_Plafond_Salon_Jardin" : T#0MS, "Temps_Total_Tetes_Murs_Salon" : T#0MS }

-->这个对应到我的"Maj_Tag_PLC.htm">

伟大!

但是,我的代码的以下部分似乎从未执行过:

$('#watchdog').text(data.watchdog)

我这么说是因为看门狗字段永远不会更新,如果我在上面放一个断点,脚本永远不会停止在这一行。

知道发生了什么吗?

谢谢你的帮助

(我已经阅读了一些关于"异步查询"的信息,以及"脚本可以在返回答案之前执行"的这一部分,但我真的不明白它是什么意思以及如何解决它。

{
"watchdog" : :="DB_HMI".Watchdog_int:,
"count" : :="DB_HMI".Watchdog_int:,
"Etat_Lampe_Plafond_Cuisine" : :="DB_HMI".Lampe_Plafond_Cuisine.Etat_Lampe:,
"Etat_Lampe_Tetes_Murs_Cuisine" : :="DB_HMI".Lampe_Tetes_Murs_Cuisine.Etat_Lampe:,
"Etat_Lampe_Plafond_Salon_Rue" : :="DB_HMI".Lampe_Plafond_Salon_Rue.Etat_Lampe:,
"Etat_Lampe_Plafond_Salon_Jardin" : :="DB_HMI".Lampe_Plafond_Salon_Jardin.Etat_Lampe:,
"Etat_Lampe_Tetes_Murs_Salon" : :="DB_HMI".Lampe_Tetes_Murs_Salon.Etat_Lampe:,
"Temps_Restant_Plafond_Cuisine" : :="DB_HMI".Lampe_Plafond_Cuisine.Temps_Restant:,
"Temps_Restant_Tetes_Murs_Cuisine" : :="DB_HMI".Lampe_Tetes_Murs_Cuisine.Temps_Restant:,
"Temps_Restant_Plafond_Salon_Rue" : :="DB_HMI".Lampe_Plafond_Salon_Rue.Temps_Restant:,
"Temps_Restant_Plafond_Salon_Jardin" : :="DB_HMI".Lampe_Plafond_Salon_Jardin.Temps_Restant:,
"Temps_Restant_Tetes_Murs_Salon" : :="DB_HMI".Lampe_Tetes_Murs_Salon.Temps_Restant:,
"Temps_Total_Plafond_Cuisine" : :="DB_HMI".Lampe_Plafond_Cuisine.Temps_Total:,
"Temps_Total_Tetes_Murs_Cuisine" : :="DB_HMI".Lampe_Tetes_Murs_Cuisine.Temps_Total:,
"Temps_Total_Plafond_Salon_Rue" : :="DB_HMI".Lampe_Plafond_Salon_Rue.Temps_Total:,
"Temps_Total_Plafond_Salon_Jardin" : :="DB_HMI".Lampe_Plafond_Salon_Jardin.Temps_Total:,
"Temps_Total_Tetes_Murs_Salon" : :="DB_HMI".Lampe_Tetes_Murs_Salon.Temps_Total:
}
<!-- AWP_In_Variable Name='"DB_HMI".Watchdog_int' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Cave.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Jardin.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Veranda_Buanderie.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Garage.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Grenier.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_WC.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Cuisine.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Cuisine.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Jardin.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Rue.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Salon.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Rue.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Chambre_Amis.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_TAO.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Entre_Fenetre_Chambre_TAO.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_Parent.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_SDB.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Hall_De_Nuit.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Grenier.Cmd_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Cave.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Jardin.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Veranda_Buanderie.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Garage.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Grenier.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_WC.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Cuisine.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Cuisine.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Jardin.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Rue.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Salon.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Rue.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Chambre_Amis.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_TAO.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Entre_Fenetre_Chambre_TAO.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_Parent.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_SDB.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Hall_De_Nuit.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Grenier.Etat_Lampe' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Cave.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Jardin.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Veranda_Buanderie.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Garage.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Grenier.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_WC.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Cuisine.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Cuisine.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Jardin.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Rue.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Salon.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Rue.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Chambre_Amis.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_TAO.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Entre_Fenetre_Chambre_TAO.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_Parent.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_SDB.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Hall_De_Nuit.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Grenier.Temps_Restant' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Cave.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Jardin.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Veranda_Buanderie.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Garage.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Annexe_Grenier.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_WC.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Cuisine.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Cuisine.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Jardin.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Salon_Rue.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Tetes_Murs_Salon.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Facade_Rue.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Chambre_Amis.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_TAO.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Entre_Fenetre_Chambre_TAO.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Chambre_Parent.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_SDB.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Hall_De_Nuit.Temps_Total' -->
<!-- AWP_In_Variable Name='"DB_HMI".Lampe_Plafond_Grenier.Temps_Total' -->
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- <meta http-equiv="refresh" content="5" > -->
<script src="jquery-3.4.1.min.js"></script>
<style>
.switch {
position: relative;
display: inline-block;
width: 90px;
height: 34px;
}
.switch input {display:none;}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ca2222;
-webkit-transition: .4s;
transition: .4s;
border-radius: 34px;
}
.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
border-radius: 50%;
}
input:checked + .slider {
background-color: #2ab934;
}
input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(55px);
}
/*------ ADDED CSS ---------*/
.slider:after
{
content:'OFF';
color: white;
display: block;
position: absolute;
transform: translate(-50%,-50%);
top: 50%;
left: 50%;
font-size: 10px;
font-family: Verdana, sans-serif;
}
input:checked + .slider:after
{  
content:'ON';
}
/*--------- END --------*/
/*----------TAbleau -----*/
table
{
border-collapse: collapse; 
}
td
{
border: 1px solid black;
	
}
</style>
</head>
<body>
-- Affichage watchdog mis a jour-----------------
<br />
watchdog :  
<label id="watchdog">0</label>
<br />
watchdog 2:  
<label id="watchdog2">0</label>
<br /> Lampe Cave etat lampe : <label id="Lampe_Cave_etat_lampe">0</label> <br />
<br />

-- Affichage myint -----------------
<br />
watchdog : :="webdata".myInt:

<br />
-- Affichage bool mis à jour -----------------
<br />
<br /> Bool1 : <label id="bool1">0</label> <br />

------------------ Gestion lumières-------------------
<br />
<table>
	<tr> 
		<td> Plafond_Cuisine </td> 
		<td> <label id= "switch" name="switch" class="switch">
			  <input id= "Etat_Lampe_Plafond_Cuisine" type="checkbox"  onclick= send_ajax_request('"DB_HMI".Lampe_Plafond_Cuisine.Cmd_Lampe',"true") >
			  <span class="slider"></span>
			</label>
		</td>
		<td> Temps restant = <label id="Temps_Restant_Plafond_Cuisine">0</label></td> 
		<td> Temps Total = <label id="Temps_Total_Plafond_Cuisine">0</label></td> 
	</tr>
	
	<tr> 
		<td> Tetes_Murs_Cuisine </td> 
		<td> <label id= "switch" name="switch" class="switch">
			  <input id= "Etat_Lampe_Tetes_Murs_Cuisine" type="checkbox"  onclick= send_ajax_request('"DB_HMI".Lampe_Tetes_Murs_Cuisine.Cmd_Lampe',"true") >
			  <span class="slider"></span>
			</label>
		</td>
				<td> Temps restant = <label id="Temps_restant_Tetes_Murs_Cuisine">0</label></td> 
		<td> Temps Total = <label id="Temps_Total_Tetes_Murs_Cuisine">0</label></td> 
	</tr>	
	
		<tr> 
		<td> Plafond_Salon_Jardin </td> 
		<td> <label id= "switch" name="switch" class="switch">
			  <input id= "Etat_Lampe_Plafond_Salon_Jardin" type="checkbox"  onclick= send_ajax_request('"DB_HMI".Lampe_Plafond_Salon_Jardin.Cmd_Lampe',"true") >
			  <span class="slider"></span>
			</label>
		</td>
		<td> Temps restant = <label id="Temps_Restant_Plafond_Salon_Jardin">0</label></td> 
		<td> Temps Total = <label id="Temps_Total_Plafond_Salon_Jardin">0</label></td> 
	</tr>
	<tr> 
		<td> Plafond_Salon_Rue </td> 
		<td> <label id= "switch" name="switch" class="switch">
			  <input id= "Etat_Lampe_Plafond_Salon_Rue" type="checkbox"  onclick= send_ajax_request('"DB_HMI".Lampe_Plafond_Salon_rue.Cmd_Lampe',"true") >
			  <span class="slider"></span>
			</label>
		</td>
		<td> Temps restant = <label id="Temps_Restant_Plafond_Salon_rue">0</label></td> 
		<td> Temps Total = <label id="Temps_Total_Plafond_Salon_rue">0</label></td> 
	</tr>
		
	<tr> 
		<td> Tetes_Murs_Salon </td> 
		<td> <label id= "switch" name="switch" class="switch">
			  <input id= "Etat_Lampe_Tetes_Murs_Salon" type="checkbox"  onclick= send_ajax_request('"DB_HMI".Lampe_Tetes_de_Murs_Salon.Cmd_Lampe',"true") >
			  <span class="slider"></span>
			</label>
		</td>
				<td> Temps restant = <label id="Temps_Restant_Tetes_Murs_Salon">0</label></td> 
		<td> Temps Total = <label id="Temps_Total_Tetes_Murs_Salon">0</label></td> 
	</tr>	
	
	
</table>
	 -----------------------------------------------------------------
</body>
<script type="text/javascript">
$(document).ready(function(){
$.ajaxSetup({ cache: false });
				setInterval(function() {
				$.getJSON("Maj_Tag_PLC.htm", function(data){
					$('#watchdog').text(data.watchdog);
					});
					
				},1000);
	
		});

					/*
										$('#watchdog2').text(data.count);
					$('#Etat_Lampe_Plafond_Cuisine').prop("checked",data.Etat_Lampe_Plafond_Cuisine);
					$('#Etat_Lampe_Tetes_Murs_Cuisine').prop("checked",data.Etat_Lampe_Tetes_Murs_Cuisine);
					$('#Etat_Lampe_Plafond_Salon_Rue').prop("checked",data.Etat_Lampe_Plafond_Salon_Rue);
					$('#Etat_Lampe_Plafond_Salon_Jardin').prop("checked",data.Etat_Lampe_Plafond_Salon_Jardin);
					$('#Etat_Lampe_Tetes_Murs_Salon').prop("checked",data.Etat_Lampe_Tetes_Murs_Salon);
					$('#Checkbox_Plafond_Cuisine').prop("checked",data.Etat_Lampe_Plafond_Cuisine);
					$('#Temps_Restant_Plafond_Cuisine').text(data.Temps_Restant_Plafond_Cuisine);
					$('#Temps_Total_Plafond_Cuisine').text(data.Temps_Total_Plafond_Cuisine);
					$('#Checkbox_Tetes_Murs_Cuisine').prop("checked",data.Etat_Lampe_Tetes_Murs_Cuisine);
					$('#Temps_Restant_Tetes_Murs_Cuisine').text(data.Temps_Restant_Tetes_Murs_Cuisine);
					$('#Temps_Total_Tetes_Murs_Cuisine').text(data.Temps_Total_Tetes_Murs_Cuisine);
					$('#Checkbox_Plafond_Salon_Rue').prop("checked",data.Etat_Lampe_Plafond_Salon_Rue);
					$('#Temps_Restant_Plafond_Salon_Rue').text(data.Temps_Restant_Plafond_Salon_Rue);
					$('#Temps_Total_Plafond_Salon_Rue').text(data.Temps_Total_Plafond_Salon_Rue);
					$('#Checkbox_Plafond_Salon_Jardin').prop("checked",data.Etat_Lampe_Plafond_Salon_Jardin);
					$('#Temps_Restant_Plafond_Salon_Jardin').text(data.Temps_Restant_Plafond_Salon_Jardin);
					$('#Temps_Total_Plafond_Salon_Jardin').text(data.Temps_Total_Plafond_Salon_Jardin);
					$('#Checkbox_Tetes_Murs_Salon').prop("checked",data.Etat_Lampe_Tetes_Murs_Salon);
					$('#Temps_Restant_Tetes_Murs_Salon').text(data.Temps_Restant_Tetes_Murs_Salon);
					$('#Temps_Total_Tetes_Murs_Salon').text(data.Temps_Total_Tetes_Murs_Salon);
					*/
	function send_ajax_request(variable, fieldId) 
	{
		if (window.XMLHttpRequest) 
		{
			req = new XMLHttpRequest();		// Mozilla and others
		} 
		else if (window.ActiveXObject) 
		{
			req = new ActiveXObject("Microsoft.XMLHTTP");	// Microsoft
		} 
		else 
		{
			alert("Der Browser unterstuezt kein Ajax");
		}
		// Oringinal code : var value = document.getElementById(fieldId).value;
		var value = fieldId.checked;
		
		var req_url = "?"+variable+"="+value+"&"+Math.random();
		//debug alert(req_url);
		req.open("GET", req_url, false);
		//req.onreadystatechange = ajax_callback;
		req.send(null);
	}
</script>
</html>

我认为您需要像这样解码 json 格式的数据:

$.getJSON("Maj_Tag_PLC.htm", function(data){
let result = JSON.parse(data);
$('#watchdog').text(result.watchdog);
});

感谢您的支持。

正确,这是一个解析问题。

愿你安好

最新更新