Question

我正在做一个学校网站项目，我用一件我想要做的事情来打击。

我有一个搜索页面，它使用Google Places API并搜索附近的地点并在页面上显示。每个地方（餐馆）的名称都是链接标记中的段落标记，该标记指向我希望使用预览页面中的信息填充的另一个页面。如何保存用户在变量中点击的内容，例如餐馆名称，并在另一页中使用此变量来填充占位符＆＃34; The Restaurant＆＃34;那里。

这是搜索页面的jQuery代码，用搜索结果填充搜索页面：

for(var i = 0;i<Object.keys(jsondata.results).length;i++){
        if(jsondata.results[i].name !== undefined){
            if(jsondata.results[i].photos !== undefined){
                photoRef = jsondata.results[i].photos[0].photo_reference;
                //alert(photoRef);
            }
            //alert(searchedResultsPhotos);
            $(".col-md-7").append("<div><img class=col-md-3 alt=restaunrant_image src="+searchedResultsPhotos+"/>"
                +"<a href=RestaurantTemplate.html><p class=restaurant_name col-md-7>"+jsondata.results[i].name+"</p></a></div");
        }

    }
    $(".col-md-7 div").addClass("row");

以下是该网站的一些截图。

搜索页面：

search page

餐厅详情：

Restaurant details

Answer 1

发送要作为QueryString参数显示的名称或值，并在新页面上读取参数。

QueryString是＆＃39;？key = value＆amp; key2 = value＆＃39;你在路径后面的URL中看到了。如果您只是在新页面上通过JavaScript阅读此内容，则可以使用＆＃34; location＆＃34;获取参数的对象。

var query = location.search;

如果您使用的是服务器端语言，通常可以阅读＆＃34;查询＆＃34;来自＆＃34;请求＆＃34;的参数参数。

for (var i = 0; i < Object.keys(jsondata.results).length; i++) {
    if (jsondata.results[i].name !== undefined) {
        if (jsondata.results[i].photos !== undefined) {
            photoRef = jsondata.results[i].photos[0].photo_reference;
            //alert(photoRef);
        }
        //alert(searchedResultsPhotos);
        var name = jsondata.results[i].name;
        $(".col-md-7").append("<div><img class=col-md-3 alt=restaunrant_image src=" + searchedResultsPhotos + "/>"
            + "<a href=RestaurantTemplate.html?name=" + name + "><p class=restaurant_name col-md-7>" + name + "</p></a></div");
    }

}
$(".col-md-7 div").addClass("row");

此帖子How can I get query string values in JavaScript?有一个很好的功能，可以使用JavaScript读取QueryString值。

此外，如果您使用此方法，则可以添加您可能想要阅读的多个值。如果您不仅需要名称，例如位置，地址或其他名称，您可以在QueryString中传递它。这就是它的用途。

Answer 2

使用此行创建锚元素：

'<a href="RestaurantTemplate.html#'+encodeURIComponent(jsondata.results[i].name)+'"><p class="restaurant_name col-md-7">'+jsondata.results[i].name+'</p></a></div>'

例如，如果餐馆名称是Hooters，则浏览器中的页面网址（加载RestaurantTemplate页面时）将类似于http://www.yourdomain.com/RestaurantTemplate.html#Hooters

然后在RestaurantTemplate页面上，您可以使用此行的javascript来检索名称：

var name = decodeURIComponent(window.location.hash.substr(1));

拉动了Hooters＆＃39;部分取消示例网址

如何保存链接html并将其传输到另一个页面以便以后使用？

2 个答案: