javascript - 在 JavaScript 中将来自服务器的数据从一个页面传递到另一个页面，而不使用表单

Question

我对 javascript 没有太多掌握，也遇到了一些问题。我的数据来自服务器，当用户单击某个项目时，用户会被重定向到一个新页面，其中包含该项目的所有详细信息。问题是当用户单击某个项目时，如何将数据从一个页面发送到下一个页面。没有使用 php。使用 javascript ajax jquery 和来自 json 的数据

这是格式，当用户单击播放按钮时，应显示一个新时代，其中向用户显示数据。

Template={"Big_Display_Template": '{{#items}}<input type="hidden" name="guid" value="{{id}}"><div class="hero" 
style="background-image:url({{videoStillURL}})"><div class="hero-content"><br>
<h2>{{name}}</h2> <p>{{shortDescription}}</p> <div class="hero-links"><a href="Watch_Live.html"      
onclick="PassDataToNextPage({{name}},{{id}},{{shortDescription}});">
Play<span class="genericon genericon-play"> </span></a></div> 
<div class="hero-links-fav"><a href="#">Favourite<span class="genericon genericon-fav"> 
</span></a></div></div></div>{{/items}}'
}

这是我的函数 PassDataToNextPage()

    function PassDataToNextPage(name,guid,Description)
    {
        var url = 'Watch_Live.html';

        $.ajax({
        url: url,
        type: 'POST',
        data: 'name=' + name + '&guid=' + guid + '&shortDescription=' + Description,

success: function(result) {
     dataUrl=data;

    }
});
        return window.location+"/"+dataUrl;
    }

我知道这是错误的，但如何改正呢？提前非常感谢

Answer 1

问题出在 return window.location+"/"+dataUrl; 行:重定向应该在 success 函数内完成，因为当请求完成:

function PassDataToNextPage(name,guid,Description)
{
  var url = 'Watch_Live.html';

  $.ajax({
    url: url,
    type: 'POST',
    data: 'name=' + name + '&guid=' + guid + '&shortDescription=' + Description,
    success: function(result) {
      dataUrl = data;
      window.location = window.location + "/" + dataUrl;
    }
  });
}

在模板中，您必须在 onclick 属性中添加 return false 以避免浏览器跟随链接中断您的处理程序:

<a href="Watch_Live.html" onclick="PassDataToNextPage({{name}},{{id}},{{shortDescription}});return false">