1

我有两个以这种方式在父子关系中工作的 HTML 页面:

第一个有一个按钮,它做两件事:首先它通过 AJAX 调用从数据库请求数据。其次,它将用户引导到具有请求数据的下一页,这些数据将由 JavaScript 处理以填充第二页。

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

$.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 对象是否已正确传递。

我根本不知道一个值得信赖的真实方法来做到这一点。我已经阅读了论坛,并且知道使用window.location.url加载第二页的基础知识,但传递数据完全是另一回事。

4

5 回答 5

2

会话 cookie 可能会解决您的问题。

在第二页上,您可以使用 Server-Script 标记或站点 document.cookie 在 cookie 中直接打印

并在下一节中再次在 Json 中转换 Cookie

怎么样?

于 2012-07-16T16:54:46.580 回答
1

我认为你有两个选择。

1) 使用 cookie - 但它们有大小限制。

2) 使用HTML5 网络存储

下一个最安全、可靠和可行的方法是使用服务器端代码。

于 2012-07-16T17:00:04.140 回答
1

免责声明:这很糟糕,但这里有:

首先,您将需要这个函数(我不久前编写了这个函数)。详细信息:http ://refactor.blog.com/2012/07/13/porting-javas-getparametermap-functionality-to-pure-javascript/

它将请求参数转换为 json 表示。

function getParameterMap () {
    if (window.location.href.indexOf('?') === (-1)) {
        return {};
    }
    var qparts = window.location.href.split('?')[1].split('&'),
        qmap   = {};
    qparts.map(function (part) {
        var kvPair = part.split('='),
            key    = decodeURIComponent(kvPair[0]),
            value  = kvPair[1];

        //handle params that lack a value: e.g. &delayed=
        qmap[key] = (!value) ? '' : decodeURIComponent(value);
    });
    return qmap;
}

接下来,在您的成功处理函数中:

success: function(json) {
    //please really convert the server response to a json
    //I don't see you instructing jQuery to do that yet!
    //handleAs: 'json'

    var qstring = '?';
    for(key in json) {
        qstring += '&' + key + '=' + json[key];
        qstring = qstring.substr(1); //removing the first redundant &
    }
    var urlTarget = 'abc.html';
    var urlTargetWithParams = urlTarget + qstring;

    //will go to abc.html?key1=value1&key2=value2&key2=value2...
    window.location.href = urlTargetWithParams;
}

在下一页上,调用 getParameterMap。

var jsonRebuilt = getParameterMap();
//use jsonRebuilt 

希望这会有所帮助(有一些额外的语句可以使事情变得非常明显)。(请记住,正如人们所指出的那样,这很可能是一种错误的做法)。

于 2012-07-16T17:12:40.463 回答
1

这是我关于两个 html 页面之间通信的帖子,它是纯 javascript,它使用 cookie: 浏览器选项卡/窗口之间的 Javascript 通信

您可以重用那里的代码将消息从一页发送到另一页。

该代码使用轮询来获取数据,您可以根据需要设置轮询时间。

于 2012-07-16T17:41:40.920 回答
1

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

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

$(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 的。这是我不久前发布的一个答案:jQuery Moblie:传递参数并动态加载页面内容

于 2012-07-16T17:42:29.207 回答