PLC程序员HTML脚本报错：ReferenceError: changeimage未定义求助

首先咱们来拆解下你遇到的错误根源：

你把changeimage函数定义在了setInterval的参数里，这属于函数表达式，它的作用域只局限在setInterval的回调内部。但你在<body onload="changeimage()">里尝试调用这个函数时，全局作用域根本找不到它，自然就抛出了ReferenceError。哪怕你去掉setInterval，原来的写法也不行——因为函数还是没暴露到全局可访问的位置。

下面给你两种实用的修复方案：

方案一：把函数声明提升到全局作用域 #

把changeimage作为独立的全局函数，然后在页面加载时先执行一次，再启动定时器实现每秒刷新，这样不管是初始化调用还是定时调用都能正常找到函数：

<body onload="startRefresh()">
  <!-- 你的页面内容 -->
</body>

<script>
// 定义全局可访问的changeimage函数
function changeimage() {
  var sonde = ["Sonda1","Sonda2","Sonda3","Sonda4"];
  var tsonde = ["tsonda1","tsonda2","tsonda3","tsonda4"];
  var temperature = [:="OUTPUT".AlarmTemp.Sonda1:,:="OUTPUT".AlarmTemp.Sonda2:,:="OUTPUT".AlarmTemp.Sonda3:,:="OUTPUT".AlarmTemp.Sonda4:];
  var hotcold = document.getElementById("Fiocco");
  
  if (:="OUTPUT".Stagione.Estate: > 0){ 
    hotcold.src="sun.jpg"
  } 
  if (:="OUTPUT".Stagione.Inverno: > 0){ 
    hotcold.src="Neve.png"
  }
  
  // 建议替换for...in为forEach，避免遍历原型链属性
  temperature.forEach(function(temp, index) {
    var icona = document.getElementById(sonde[index]);
    icona.src = temp > 0 ? "Paverde.png" : "Parossa.png";
  });
}

// 初始化刷新逻辑：先执行一次避免延迟，再启动定时器
function startRefresh() {
  changeimage();
  setInterval(changeimage, 1000);
}
</script>

方案二：去掉onload属性，用DOM加载事件绑定（更解耦） #

如果你不想在HTML标签里写onload属性，可以直接在脚本里监听页面加载完成事件，代码结构更清晰：

<body>
  <!-- 你的页面内容 -->
</body>

<script>
function changeimage() {
  // 和方案一的函数内容完全一致
  var sonde = ["Sonda1","Sonda2","Sonda3","Sonda4"];
  var tsonde = ["tsonda1","tsonda2","tsonda3","tsonda4"];
  var temperature = [:="OUTPUT".AlarmTemp.Sonda1:,:="OUTPUT".AlarmTemp.Sonda2:,:="OUTPUT".AlarmTemp.Sonda3:,:="OUTPUT".AlarmTemp.Sonda4:];
  var hotcold = document.getElementById("Fiocco");
  
  if (:="OUTPUT".Stagione.Estate: > 0){ 
    hotcold.src="sun.jpg"
  } 
  if (:="OUTPUT".Stagione.Inverno: > 0){ 
    hotcold.src="Neve.png"
  }
  
  temperature.forEach(function(temp, index) {
    var icona = document.getElementById(sonde[index]);
    icona.src = temp > 0 ? "Paverde.png" : "Parossa.png";
  });
}

// 页面DOM加载完成后启动刷新
document.addEventListener('DOMContentLoaded', function() {
  changeimage();
  setInterval(changeimage, 1000);
});
</script>

额外小优化建议 #

• 把图片路径统一定义成常量，后期维护更方便：

  const IMAGE_PATHS = {
    sun: "sun.jpg",
    snow: "Neve.png",
    green: "Paverde.png",
    red: "Parossa.png"
  };
  // 使用时直接写IMAGE_PATHS.sun即可
  

• 如果PLC数据更新有延迟，可以考虑给定时器加防抖逻辑，但对于每秒刷新的场景来说，当前写法已经足够稳定。

内容的提问来源于stack exchange，提问作者Danilo Cervellini