如何使用JQuery将数据从一个HTML页面传递到另一HTML页面? [英] How to pass data from one HTML page to another HTML page using JQuery?

问题描述

我有两个以亲子关系工作的HTML页面:

I have two HTML pages that work in a parent-child relationship in this way:

第一个按钮有两个作用:第一，它通过AJAX调用从数据库请求数据.其次，它将用户引导到具有所请求数据的下一页，JavaScript将对其进行处理以填充第二页.

The first one has a button which does two things: First it requests data from the database via an AJAX call. Second it directs the user to the next page with the requested data, which will be handled by JavaScript to populate the second page.

我已经可以通过ajax调用获取数据并将其放入JSON数组:

I can already obtain the data via an ajax call and put it in a JSON array:

$.ajax({
    type: "POST",
    url: get_data_from_database_url,
    async:false,
    data: params,
    success: function(json)
    {
        json_send_my_data(json);
    }
});

function json_send_my_data(json)
{
    //pass the json object to the other page and load it
}

我假设在第二页上，一个文档就绪"的JavaScript函数可以轻松地处理所有数据的传递JSON对象的捕获.对我来说，最好的测试方法是在文档准备功能中使用alert("My data: " + json.my_data.first_name);来查看JSON对象是否已正确传递.

I assume that on the second page, a "document ready" JavaScript function can easily handle the capture of the passed JSON object with all the data. The best way to test that it works is for me to use alert("My data: " + json.my_data.first_name); within the document ready function to see if the JSON object has been properly passed.

我只是不知道执行此操作的受信任的真实方法.我已经阅读了论坛，并且知道使用window.location.url加载第二页的基本知识，但是传递数据完全是另一回事.

I simply don't know a trusted true way to do this. I have read the forums and I know the basics of using window.location.url to load the second page, but passing the data is another story altogether.

推荐答案

警告:这仅适用于单页面模板，其中每个伪页面都有其自己的HTML文档.

Warning: This will only work for single-page-templates, where each pseudo-page has it's own HTML document.

您可以通过手动使用$.mobile.changePage()函数来在页面之间传递数据，而不是让jQuery Mobile为您的链接调用它:

You can pass data between pages by using the $.mobile.changePage() function manually instead of letting jQuery Mobile call it for your links:

$(document).delegate('.ui-page', 'pageinit', function () {
    $(this).find('a').bind('click', function () {
        $.mobile.changePage(this.href, {
            reloadPage : true,
            type       : 'post',
            data       : { myKey : 'myVal' }
        });
        return false;
    });
});

以下是此文档: http://jquerymobile. com/demos/1.1.1/docs/api/methods.html

您也可以简单地将数据存储在下一页的变量中.这是可能的，因为jQuery Mobile页面存在于同一DOM中，因为它们是通过AJAX引入DOM的.这是我不久前发布的答案:

You can simply store your data in a variable for the next page as well. This is possible because jQuery Mobile pages exist in the same DOM since they are brought into the DOM via AJAX. Here is an answer I posted about this not too long ago: jQuery Moblie: passing parameters and dynamically load the content of a page

这篇关于如何使用JQuery将数据从一个HTML页面传递到另一HTML页面?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！