Javascript 将URL固定到即时JSON搜索脚本的SERP

我有一个像Google Instant search这样的搜索脚本，它在您键入时显示相关结果。它是用JSON编写的，并使用JavaScript作为用户类型生成结果的URL。但是，如果单击结果，然后返回SERP，则不会显示结果。你必须重新开始搜索。为什么会这样？我希望你能理解我想描述的内容

以下是我的HTML代码：

<input type="text" id="search" name="q">
<div id="result"></div>

以下是我的JSON代码：

$(document).ready(function(){
    $("#search").keyup(function(){
        var search=$(this).val();
        var keyword=encodeURIComponent(search);
        var yt_url='http://api.search.live.net/json.aspx?JsonType=callback&JsonCallback=?&Appid=642636B8B26344A69F5FA5C22A629A163752DC6B&query='+keyword+'&sources=web';

        $.ajax({
            type:"GET",
            url:yt_url,
            dataType:"jsonp",
            success:function(response){
                $("#result").html('');
                if(response.SearchResponse.Web.Results.length){
                    $.each(response.SearchResponse.Web.Results, function(i,data){
                        var title=data.Title;
                        var dis=data.Description;
                        var url=data.Url;
                        var final="<div class='webresult'><div class='title'><a href='"+url+"'>"+title+"</a></div><div class='desc'>"+dis+"</div><div class='url'>"+url+"</div></div>";
                        $("#result").append(final);
                    });
                }
            }
        });
    });
});

---

如果我理解正确，那么您正在进行一次整版加载以转到结果，当您返回时，您将进行另一次整版加载

基本上，如果您想在页面负载上持久化搜索结果，您必须将searchquery存储在会话范围内或作为cookie，并且当会话/cookie存在时，javascript代码必须像在searchfield中键入一样发出搜索

因此，当你点击一个结果，然后返回时，javascript会足够聪明地知道这是一个返回的用户，他以前做过搜索。并将相同的结果填充到DOM中

---

DOM更改不会在页面加载上持久化。

有许多替代方法。将搜索查询存储到会话范围实现取决于您的应用程序服务器，使用jQuery将其存储为cookie。cookie framework将限制其生存时间。。比如说1个小时，或者你可以来回传递请求参数，但我不建议这样做，因为这种逻辑可能很容易中断，并且可能无法使用“后退”按钮。我不确定谷歌会做什么，但在我看来，他们会以某种方式将状态保留为请求参数。