Question

我对JavaScript知之甚少，这是我的代码：

<script language="JavaScript">
var x = 10

function startClock() {
    if (x !== ' ') {
        x = x - 1
        document.frm.clock.value = x
        setTimeout("startClock()", 1000)
    }
    if (x == 0) {
        x = ' ';
        document.frm.clock.value = x;
        success.location.href = "success.php";
    }
}
</script>
<body onLoad(startClock);>

受影响的iframe：

<input name="clock" size="3" readonly="readonly"

<iframe name="success" src="blank.htm"></iframe>

当计时器倒计时，success.php加载两次。我知道这是因为1.）它将数据插入我的数据库两次，2。）我实际上可以在选项卡中看到加载符号重新加载一秒。

当我将功能更改为：

 <script language="JavaScript">

var x = 10
var y = 1

function startClock() {
    if (x !== 'Fin') {
        x = x - y
        document.frm.clock.value = x
        setTimeout("startClock()", 1000)
    }
    if (x == 0) {
        x = 'Fin';
        document.frm.clock.value = x;
        success.location.href = "success.php";
    }
}

</script>

...页面只加载一次。

谁能告诉我这里发生了什么？我也尝试使用'0'代替''并获得相同的双重执行......

Answer 1

在Javascript中有两个比较运算符：

“==” - 表示等于

“===”表示“完全等于” - 这意味着值和TYPE必须相同

我怀疑（虽然我不想测试理论）如果你在原始代码中使用“===”而不是“==”，你会发现它按照你的意图工作。但是，有许多事情需要修复 - 1）你与使用“;”不一致，2）代码应该构造成确保在任何给定的迭代中它只能“重启”计时器或激活成功从来没有。这是一个更清洁的版本：

<script language="JavaScript">
   // 10 iterations at 1 second intervals
   var x = 10;

   function startClock() {
     document.frm.clock.value = --x;
     if (x <= 0) {
       document.frm.clock.value = x;
       success.location.href = "success.php";
     } else {
       setTimeout("startClock()", 1000);
     }
   } // startClock
</script>
<body onLoad(startClock);>

Answer 2

将其更改为：

if (x == 0) {  // note this is now first
    x = ' ';
    document.frm.clock.value = x;
    success.location.href = "success.php";
} else if (x !== ' ') { // note the else/if
    x = x - 1;
    document.frm.clock.value = x;
    setTimeout("startClock()", 1000)
}

否则，当x为1时，将设置startClock（）的超时，并且将加载该位置。然后，超时将触发，再次加载页面（因为x = ' '和' ' == 0返回true）。

可能更好的做法是说：

if (x === 0) {  // note the ===
    x = ' ';
    document.frm.clock.value = x;
    success.location.href = "success.php";
} else if (x !== ' ') {
    x = x - 1;
    document.frm.clock.value = x;
    setTimeout("startClock()", 1000)
}

因为您不需要==为您做的真值转换。

'Fin'代替' '的示例有效，因为在加载位置后startClock()来电时，x为'Fin'，{ {1}}是假的。

Answer 3

首先是几件事。在您的示例中有许多“草率”编码实践（例如缺少分号）。虽然代码可能会运行，但可以通过一些jslint帮助来改进。

所以看看x = 1时的情况。你递减x所以现在x = 0.然后调用setTimeout，它将等待1秒，然后调用名为startClock的方法。但是，setTimeout不会阻止您的执行。因此，在使用x = 0调用setTimeout之后立即执行下面的代码，其中将x设置为''（并加载页面）。现在，在该代码运行一秒后，由于计时器触发，再次调用您的方法。由于x现在为''，因此跳过顶部块，第二次进入x == 0块。

JavaScript - 函数返回两次

3 个答案: