Question

如何在特定时间发送Ajax请求，并且只发送特定事件

我是用户时间间隔但它不起作用。

我希望获取请求1中的数据以便在请求2中使用，但它在请求2中获取空数据

的setInterval（）

它不适合我。

我想在请求1的一段时间之后发送请求2

请求1： -

$(document).on("change", ".supplyItem", function (event) {

        var id = $(this).attr("data-id");
        var supplyItem = $(".supplyItem[data-id=" + id + "]").val();
        var hospital = $("#hospital").val();
        var physician = $("#physician").val();
        var category = $("#category").val();
        var manufacturer = $("#manufacturer").val();
        var project = $("#project").val();

        if (hospital != "" && physician != "" && category != "" && manufacturer != "" && project != "") {
            $.ajax({
                url: "{{ URL::to('admin/repcasetracker/getitemfile')}}",
                data: {
                    supplyItem: supplyItem,
                    hospital: hospital,
                    project: project,
                },

                success: function (data) {

                    console.log(id);
                    if (data.status) {
                        var html_data = '';
                        var item = data.value;
                        console.log(item);


                        $('.hospitalPart[data-id=' + id + ']').val(item.hospitalNumber);
                        $('.mfgPartNumber[data-id=' + id + ']').val(item.mfgPartNumber);

                        // $('.mfgPartNumber[data-id='+id+']').text('something');
                    } else {
                        $('.hospitalPart[data-id=' + id + ']').val('');
                        $('.mfgPartNumber[data-id=' + id + ']').val('');

                    }

                    $('.quantity[data-id=' + id + ']').val('');
                    $('.purchaseType[data-id=' + id + ']').val('');
                    $('#serial-text' + id).val('');
                    $('#serial-drop' + id).val('');

                    $('#serial-drop' + id).empty();


                }

            });
        }

    });

请求2： -

 $(document).on('change', '.supplyItem', function (event) {
        var timer, delay = 2000;
        var id = $(this).attr("data-id");
        var client = $("#hospital").val();

        timer = setInterval(function(){

            var supplyItem = $(".supplyItem[data-id=" + id + "]").val();
            var hospitalPart = $(".hospitalPart[data-id=" + id + "]").val();
            var mfgPartNumber = $(".mfgPartNumber[data-id=" + id + "]").val();
            alert(supplyItem);
            alert(hospitalPart);
            alert(mfgPartNumber);

            $.ajax({
                url: "{{ URL::to('admin/repcasetracker/getdevicedata')}}",
                data: {
                    supplyItem: supplyItem,
                    hospitalPart: hospitalPart,
                    mfgPartNumber: mfgPartNumber,
                    client: client,

                },

                success: function (data) {

                    if (data.status) {
                        var html_data = '';

                        var check = data.value;

                        if (check == 'True') {
                            html_data += "<option value=''>Purchase Type</option><option value='Bulk'>Bulk</option><option value='Consignment'>Consignment</option>";
                            $('.purchaseType[data-id=' + id + ']').html(html_data);

                        } else {
                            html_data += "<option value=''>Purchase Type</option><option value='Consignment'>Consignment</option>";

                            $('.purchaseType[data-id=' + id + ']').html(html_data);

                        }
                    }


                }


            });
            }, delay);
        clearInterval(timer);
    });

Answer 1

您可以将Request 2移到一个函数中，此JS代码将在给定的时间间隔（毫秒）后调用Request2函数，我现在将其设置为5秒。

setInterval(function () { Request2(); }, 5000);

function Request2(){
console.log("Request 2 called");
//add request 2 code here
}

Answer 2

首先确定：不是使用setInterval，而是在运行一次后清除间隔，为什么不使用

setTimeout(function, delay);

然后我个人更喜欢使用XMLHttpRequest而不是Jquery AJAX，Jquery在它的基础上使用XMLHttpRequest，我只是喜欢它所以我不必使用Jquery，但如果你已经在你的网站中使用Jquery那么它应该不再重。这是XMLHttpRequest的一个快速示例，因此如果您愿意，可以使用它。

var xhr = new XMLHttpRequest();
  xhr.open("POST", 'URL::to("admin/repcasetracker/getdevicedata")', true);
  xhr.setRequestHeader("Content-Type", "application/json charset=utf8");
  xhr.onreadystatechange = function () {
    if (xhr.readyState == 4 && xhr.status == 200) {
      // content is loaded...
      if (xhr.responseText) {
        //Some code to run after the server responds and it was successfull
      }
    }
  };
  xhr.send(JSON.stringify({test:'test'})); //This is the data you are handing to the server

注意使用xhr.responseText，JQuery使用相同的变量，这通常是来自服务器的响应。一个可靠的方法是使用浏览器的调试引擎（Chrome和Firefox上的F12，不知道其他浏览器）来检查变量，很容易确定要使用的正确变量。

然后最后一个想法：当你将数据发送到服务器时，我发现你没有声明内容类型而不是JSON.stringify'ing（）你的数据。

调试这种情况的最佳方法是'elimation of elimation'，以便查明服务器是否正在接收数据，然后服务器是否正确处理数据，然后检查服务器是否正在正确发送数据。如果您正在使用Nginx，请使用/var/log/nginx/error.log查看是否会抛出任何错误（提示：tail -f /var/log/nginx/error.log | Apache使用/ var / log / http /大多数发行版上的error.log）如果你使用的是.NET，只需在Visual Studio中调试它。

阅读Jquery成功事件后，还会传递另外两个参数 - String textStatus和jqXHR jqXHR http://api.jquery.com/jquery.ajax/

总结一下：确保声明dataType：'json'

使用正确的变量，应该是responseText

传递服务器数据并使用'json'时，请确保使用JSON.stringify（）

我不太清楚你为什么要首先使用setTimeout。如果您只是在等待服务器响应，那么使用任何类型的延迟将是一个糟糕的主意，而是使用服务器响应后触发的事件。

所以在Jquery中成功：function（）{}和error：function（）{} 在XMLHttpRequest中，它是xhr.onreadystatechange = function（）{}

Answer 3

jQuery＆＃39; s $.ajax method返回一个promise，它传递服务器端调用的结果。您可以将这些调用链接在一起，以便您可以构建多个ajax调用的结果。当您以这种方式使用它时，您将取消success回调，因为它们不再是必需的。

应用于您的代码可能看起来像这样：

$(document).on("change", ".supplyItem", function (event) {

        var id = $(this).attr("data-id");
        var supplyItem = $(".supplyItem[data-id=" + id + "]").val();
        var hospital = $("#hospital").val();
        var physician = $("#physician").val();
        var category = $("#category").val();
        var manufacturer = $("#manufacturer").val();
        var project = $("#project").val();

        if (hospital != "" && physician != "" && category != "" && manufacturer != "" && project != "") {
            $.ajax({
                url: "{{ URL::to('admin/repcasetracker/getitemfile')}}",
                data: {
                    supplyItem: supplyItem,
                    hospital: hospital,
                    project: project,
                })
                .then(function(data1){
                   // process result of call1 and make call2
                   var item = data1.value;
                   return $.ajax({
                      url: "{{ URL::to('admin/repcasetracker/getdevicedata')}}",
                      data: {
                        supplyItem: supplyItem,
                        hospitalPart: value.hospitalPart, // note using result from 1 directly
                        mfgPartNumber: value.mfgPartNumber,
                        client: hospital 
                     }
                   });
                })
                .then(function(data2){
                    // process result of call2
                });
        };
    });

这里的要点是你不需要将call1的结果存入某些元素并在进行call2之前重新读取它们，并尝试在进行call2之前等待足够的时间。您只需将其与then链接在一起。

如何在特定时间后发送Ajax请求

3 个答案: