Question

我正在研究一个PHP Laravel项目，当用户单击网站上的一个按钮时，我使用AJAX对PHP后端执行一些后台任务，当用户通过他/她进行付款时，我触发了对支付网关的呼叫电话，然后检查付款状态（其中1表示已付款，0表示未付款），如果状态等于1，则将用户重定向到成功页面。

目前，我正在使用AJAX将数据从前端发布到后端，我想在5秒后定期发布数据（在此之前，我给了用户一些时间付款，然后再联系API以查看状态是否已更改）设为1，然后重定向用户）。

我正在尝试在JavaScript中使用setTimeout方法，并对控制器中的数据dd（）进行操作，该数据仅转储一次，但5秒后不转储

AJAX代码，可在5秒后将数据发布到后端

  $('.mpesa').on('click', function () {
      // run the first time; all subsequent calls will take care of themselves
      setTimeout(executeQuery, 5000);
    });

    function executeQuery() {
      alert('clicked');
        //Adds Class to the page when it loads
        $('.PAY').addClass("loading");
        //Gets the MPESA type
        var type = $('.mpesa').prop('id');
        var quote = $('#quote').val();
        var phone = $('#phone').val();
        //Converts to a JSON object
        var type ={
          'type': type,
          'quote' : quote,
          'phone' : phone,
        };

        console.log(type);

        $.ajax({
            //Contains controller of payment
            type: 'POST',
            url: 'paymentFinal',
            data: JSON.stringify(type),
            contentType: 'application/json',
            dataType: "json",
            success: function success(response) {
                console.log(response);
            },
            error: function error(data) {
                console.log(data);
            }
        });
    }
    //End AJAX call

正在调用控制器文件

 public
    function payFinal(Request $request)
    {
        dd($request->all());

    }

更新的AJAX代码

$('.mpesa').on('click', function () {
    setInterval(function() {
       alert('clicked');
      //Gets the MPESA type
       var type = $('.mpesa').prop('id');
      var quote = $('#quote').val();
      var phone = $('#phone').val();
      //Converts to a JSON object
      var type ={
        'type': type,
        'quote' : quote,
        'phone' : phone,
      };

    console.log(type);
    $.ajax({
        //Contains controller of payment
        type: 'POST',
        url: 'paymentFinal',
        data: JSON.stringify(type),
        contentType: 'application/json',
        dataType: "json",
        success: function success(response) {
          if(response) {
              window.location.href="success";
          }
        },
        error: function error(data) {
            console.log(data);
        }
    });
}, 15000); // Execute every 15 seconds
});

Answer 1

setTimeout仅在您设置的延迟后执行一次指定的功能。请改用setInterval，以便定期调用您的函数。

================================================ ========================

更新：您希望您的函数在用户单击时立即执行，然后每15秒调用一次。为此，您可以使用以下代码：

$('.mpesa').on('click', executeQuery);

function executeQuery() {
  alert('clicked');
    //Adds Class to the page when it loads
    $('.PAY').addClass("loading");
    //Gets the MPESA type
    var type = $('.mpesa').prop('id');
    var quote = $('#quote').val();
    var phone = $('#phone').val();
    //Converts to a JSON object
    var type ={
      'type': type,
      'quote' : quote,
      'phone' : phone,
    };

    console.log(type);

    $.ajax({
        //Contains controller of payment
        type: 'POST',
        url: 'paymentFinal',
        data: JSON.stringify(type),
        contentType: 'application/json',
        dataType: "json",
        success: function success(response) {
            console.log(response);
        },
        error: function error(data) {
            console.log(data);
        }
    });

    //use setTimeout here
    setTimeout(executeQuery, 15000);

}

在函数中使用setTimeout来调用自身即可解决问题。

================================================ ========================

[要回答OP关于如何停止计时器的问题]

在函数中，说您希望函数在5次后停止执行。

在函数外设置变量：

var counter = 0;

然后在executeQuery中输入

：

if (counter <= 5) { //or use your own logic
    counter++;
    setTimeout(executeQuery, 15000);
}

请记住，setTimeout是一次性的，因此您可以控制何时停止调用它。

使用AJAX定期将数据重新发布到Laravel后端时出现问题

1 个答案: