Ajax等到重定向完成执行。

时间:2016-04-19 04:35:03

标签: javascript jquery ajax

我的问题与下面链接中描述的问题基本相同,但我没有找到解决方案。我希望我的ajax成功函数等到窗口函数执行完毕,然后修改div。相反,它修改当前页面的div,然后重定向。 AJAX: on success redirect then modify new page

main.js

$("#form").submit( function(e) {
    e.preventDefault();
    var id = $('#searchbar').val(); // store the form's data.   
        $.ajax({
                url: '/search',
                type: 'POST',
                data: {id:id}, 
                dataType: 'text',


            success: function(data) {

                //Redirect to the page where we want to display the data
                window.location.href = '/test';


                data = JSON.parse(data);
                console.log(data);
                $("#count").text("we analyzed...");
                $("#result1").text(data.county);
                $("#totals").text("with a score of..");
                $("#result2").text(data.totalSentiments);


   },
   error: function(jqXHR, textStatus, errorThrown){
     console.log("error")
     alert(textStatus, errorThrown);
  }
});

});

3 个答案:

答案 0 :(得分:6)

我会建议你Javascript Local Storage

main.js

$("#form").submit( function(e) {
    e.preventDefault();
    var id = $('#searchbar').val(); // store the form's data.   
        $.ajax({
                url: '/search',
                type: 'POST',
                data: {id:id}, 
                dataType: 'text',


            success: function(data) {

                //Redirect to the page where we want to display the data
                window.location.href = '/test';


                data = JSON.parse(data);
                console.log(data);
                // Store
                localStorage.setItem("count", "we analyzed...");
                localStorage.setItem("result1", data.county);
                localStorage.setItem("totals", "with a score of..");
                localStorage.setItem("result2", data.totalSentiments);

   },
   error: function(jqXHR, textStatus, errorThrown){
     console.log("error")
     alert(textStatus, errorThrown);
  }
});

});

在同一页面上准备就绪:

jQuery(document).ready(function(){
    if (localStorage.count) {
        $("#count").text(localStorage.count);
    }
    if (localStorage.result1) {
        $("#result1").text(localStorage.result1);
    }
    if (localStorage.totals) {
        $("#totals").text(localStorage.totals);
    }
    if (localStorage.result2) {
        $("#result2").text(localStorage.result2);
    }
});

浏览器存储中的本地存储存储数据。您还可以从本地存储中删除数据。

答案 1 :(得分:1)

设置location.href的值将导致整页刷新。

因此,您的所有脚本都将被删除。

如果您真的想要使用ajax调用重定向页面的结果,您应该将此响应数据存储在某个地方,然后在新页面上重复使用。

//save "data" in localSotorage
localStorage.myAjaxResponse = data; //if data is JSON then use: JSON.stringify(data) instead.

然后在你的" / test"页面,创建一个脚本来检查localStorage上的值,然后显示它。

    data = JSON.parse(localStorage.myAjaxResponse);
    console.log(data);
    $("#count").text("we analyzed...");
    $("#result1").text(data.county);
    $("#totals").text("with a score of..");
    $("#result2").text(data.totalSentiments);

虽然,还有其他更好的方法可以达到你想要的效果。

答案 2 :(得分:1)

您可以这样做:

关于你的ajax成功:

   var params={};
   window.location.search
          .replace(/[?&]+([^=&]+)=([^&]*)/gi, function(str,key,value) {
            params[key] = value;
          }
        );
    if (params.length > 0) {
        $("#count").text("we analyzed...");
        $("#result1").text(params['county']);
        $("#totals").text("with a score of..");
        $("#result2").text(params['sentiments']);
    }

然后在{{1}}页面上写下javascript块:

{{1}}