Java脚本:在函数中分配var，在函数外使用var

Java Script: assign var in function and use var out that function

本文关键字：函数 var 脚本 Java 分配      更新时间：2023-09-26
<script type="text/javascript">
var statustext="test";
$zack(function() {
  $zack.setOnStatus(changelable);
});
function changelable(status) {
  if (status=='A')
    statustext="OK";
  else if (status=='B')
    statustext="Ready";
  else if (status=='C')
    statustext="Go";
  document.getElementById('title').innerHTML = statustext; // OK, Ready or Go
}
</script>

document.getElementById('title').innerHTML显示OK、Ready或Go。

但是，当我在上面的脚本下面的某个地方使用这个脚本时，statustext变量包含测试文本作为预分配：

<script type="text/javascript">
document.getElementById('title2').innerHTML = statustext; // test
</script>

我想多次将statustext与OK、Ready或Go文本一起使用。如何做到这一点？

加载页面时，您的title2代码会立即运行，但您的其他代码会响应事件(状态更改事件或调用changelable的任何事件(而运行。

如果您想将title2设置为与将title设置为相同的内容，请移动此行：

document.getElementById('title2').innerHTML = statustext;

进入changelable函数，就在这一行之后：

document.getElementById('title').innerHTML = statustext;

例如：

document.getElementById('title').innerHTML = statustext;
document.getElementById('title2').innerHTML = statustext;

或者如果你喜欢：

document.getElementById('title').innerHTML = document.getElementById('title2').innerHTML = statustext;

另外，您的if/else if/else if序列实际上就是switch语句的作用：

function changelable(status) {
  switch (status) {
    case 'A':
      statustext="OK";
      break;
    case 'B':
      statustext="Ready";
      break;
    case 'C':
      statustext="Go";
      break;
  }
  document.getElementById('title').innerHTML = statustext;
  document.getElementById('title2').innerHTML = statustext;
}

或者你可以使用一个查找表：

var statustext="test";
var statusLabels = {
    A: "OK",
    B: "Ready",
    C: "GO"
};
$zack(function() {
  $zack.setOnStatus(changelable);
});
function changelable(status) {
  statustext = statusLabels[status] || statustext;
  document.getElementById('title').innerHTML = statustext;
  document.getElementById('title2').innerHTML = statustext;
}
相关文章：