setTimeout 只在循环中运行一次

Question

我的目标是每 X 秒执行一次 javascript 函数。我读过应该使用 setInterval ，但在我的情况下我不相信。我也不希望必须重新发送变量，以防用户决定在正式发送所有内容之前更改内容

例如，我输入了 60 个时间和 5 个数量，但它等待了 60 秒，然后只发送了 5 个，每 60 秒发送 1 个文本，直到它发送了 5 个文本

我的 javascript

    $('input[name="sendtxt"]').click(function(e) {
        sendText(e);
    });

function sendText(e) {
    e.preventDefault();
    var phonenum = $('input[name="phonenum"]').val();
    var provider = $('select[name="provider"]').val();
    var message = $('textarea[name="message"]').val();
    var otherprov = $('input[name="otherprov"]').val();
    var amount = $('input[name="amount"]').val();
    var time = $('input[name="time"]').val() * 1000;
    var sendmsg;
    for (sendmsg = 1; sendmsg <= amount; sendmsg++) {
        setTimeout(function() {
            $.ajax({
                type: 'POST',
                data: {
                    provider: provider,
                    message: message,
                    phonenum: phonenum,
                    amount: amount,
                    otherprov: otherprov,
                    time: time
                },
                url: 'send.php',
                success: function(data) {
                    console.log('Success. Sent ' + sendmsg + " texts.");
                },
                error: function(xhr, err) {
                    console.log("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
                    console.log("responseText: " + xhr.responseText);
                }
            });
        }, time);
    }

还有我的 PHP

<?php


$to = $_POST["phonenum"];
$provider = $_POST["provider"];

$otherprov = $_POST["otherprov"];
$fixedotherprov = str_replace("otherprovider", "", $otherprov);


$completenum = $to . $provider . $fixedotherprov;
$completenum = str_replace('otherprovider', '', $completenum);
$subject = 'Hello';
$message = $_POST["message"];
$headers = 'From: Daniel';
$amount = $_POST["amount"];

//for ($x = 0; $x < $amount; $x++) {
    mail($completenum, $subject, $message, $headers);
//}

?>

Answer 1

setTimeout是一个异步函数。超时事件在您的循环中定义，从sendmsg = 1 到sendmsg <= amount。执行 for 循环后，将执行 for 循环下方的其余代码，直到触发 timeout 事件。当触发超时事件时，sendmsg 的值等于amount+1，因为循环已经完成执行。因此，所有超时事件的值都是 sendmsgas amout+1 导致意外行为..

在下面的代码中，每次迭代都会定义一个临时范围，它为每个 timeout 事件提供不同的 sendmsg 值。

您还必须在每次迭代中安排不同的时间作为超时时间值，以便在不同的超时时间内执行它们。

像这样修改你的代码..

function sendText(e) {
    e.preventDefault();
    var phonenum = $('input[name="phonenum"]').val();
    var provider = $('select[name="provider"]').val();
    var message = $('textarea[name="message"]').val();
    var otherprov = $('input[name="otherprov"]').val();
    var amount = $('input[name="amount"]').val();
    var time = $('input[name="time"]').val();
    var sendmsg;
    for (sendmsg = 1; sendmsg <= amount; sendmsg++) {
            (function(sendmsg){
               setTimeout(function() {
                $.ajax({
                    type: 'POST',
                    data: {
                        provider: provider,
                        message: message,
                        phonenum: phonenum,
                        amount: amount,
                        otherprov: otherprov,
                        time: time * 1000 * sendmsg
                    },
                    url: 'send.php',
                    success: function(data) {
                        console.log('Success. Sent ' + sendmsg + " texts.");
                    },
                    error: function(xhr, err) {
                        console.log("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
                        console.log("responseText: " + xhr.responseText);
                    }
                });
            }, time * 1000 * sendmsg);
           })(sendmsg);
        }
}

Answer 2

这是范围问题。

阅读有关 Javascript 闭包（作用域）函数的更多信息：http://brackets.clementng.me/post/24150213014/example-of-a-javascript-closure-settimeout-inside

将您的代码更改为：

for (sendmsg = 1; sendmsg <= amount; sendmsg++) {
    (function(){
        setTimeout(function(_provider, _message, _phonenum, _amount, _otherprov, _time, _sendmsg) {
            $.ajax({
                type: 'POST',
                data: {
                    provider: _provider,
                    message: _message,
                    phonenum: _phonenum,
                    amount: _amount,
                    otherprov: _otherprov,
                    time: _time
                },
                url: 'send.php',
                success: function(data) {
                    console.log('Success. Sent ' + _sendmsg + " texts.");
                },
                error: function(xhr, err) {
                    console.log("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
                    console.log("responseText: " + xhr.responseText);
                }
            });
        }, time);
    })(provider, message, phonenum, amount, otherprov, time, sendmsg);
}

希望有帮助。