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

Posted 2023-02-22

【中文标题】将来自服务器的数据从一个页面传递到另一个页面，而不使用表单

【英文标题】：Passing data that is coming from a server, from one page to another in javascript without using forms

【发布时间】：2015-11-09 02:09:12

【问题描述】：

我对 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;
    

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

【问题讨论】：

通过格式化您的代码使其更具可读性来使其正确。

【参考方案1】：

看起来你想传递数据并带着数据进入下一页，你不需要ajax来实现。简单地说：

function PassDataToNextPage(name,guid,Description)

    var url = 'Watch_Live.html';
    window.location.href = url + '?name=' + name + '&guid=' + guid + '&shortDescription=' + Description;

评论：

你可以使用：

播放

点击事件将由onclick中的函数PassDataToNextPage处理。

假设您在下一页使用 PHP，您可以获取数据

$name = $_GET['name']; $guid = $_GET['guid']; $shortDesc = $_GET['shortDescription'];

【讨论】：

我应该在play

中写些什么

我将如何从下一页的查询字符串中获取数据@jackie

【参考方案2】：

您可以通过 url GET 参数传递 key:value 数据。 例如：如果你想向这个页面传递数据：Watch_Live.html，你可以这样做：

<a href="Watch_Live.html?name=someName&guid=you_guid"><button>Pass data</button></a>

要解析其他页面中的参数，请阅读此 SO answer to a similar question。 https://***.com/a/901144/4440845

【参考方案3】：

问题出在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">

【讨论】：

我应该在play

中写些什么