初步想法(在创建解决方案之前)
对大数据使用 POST 而不是 GET。使用 POST 不会将查询字符串用于数据,因此 URL 长度限制不是问题。 (不同浏览器的最大 URL 长度不同,因此在移动大数据时您应该远离它)。
特殊的 URL 字符可以是 encoded 以在查询字符串中传递,所以这应该不是问题。
或者,您可以将数据从第一页存储在服务器端,并让第二页从服务器端获取数据。但这太过分了。它使您可以进行不需要的服务器编程。
通过 HTTP 调用传递状态是标准做法。你不应该试图规避它。使用它。所有的设施都是为你而建的。现在只需要 jQuery 来为我们提供一些帮助......
注意: 小心在浏览器禁用 JavaScript 的情况下使用 jQuery 实现主要应用功能。在大多数情况下,即使禁用了 JavaScript,您的 Web 应用程序也应该在基本级别上可用。在这工作之后,在 JavaScript/jQuery 上进行分层以使体验更好,甚至很棒。
编辑:解决方案(使用 ASP.NET 处理)
解决方案实施的关键资源是:
它是如何工作的:从一个主页,一个 POST 发生并且结果显示在一个弹出窗口中。它按以下顺序发生:
- 主脚本打开一个弹出窗口(如果它不存在)
- 主脚本等待弹出窗口完全初始化
- 主脚本 POST(使用 AJAX)参数到另一个页面(发送请求)
- 主脚本接收响应并在弹出窗口中显示。
实际上,我们已将数据发布到弹出窗口并将参数传递给处理。
接下来是三个页面,它们构成了完整的解决方案。我将所有 3 个都放在我的桌面上,它可以在 Google Chrome 稳定版 3.0.195.38 中运行。其他浏览器未经测试。您还需要将jquery-1.3.2.js 放在同一个文件夹中。
main_page.html
这是您提供的逻辑的扩展。示例使用链接而不是表单按钮,但它具有相同的id=sourcePageBtn。
此示例在 POST 发生时传递两个键/值对(仅作为示例)。您将在此位置传递您选择的键/值对。
<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
</head>
<body>
<a id="sourcePageBtn" href="javascript:void(0);">click to launch popup window</a>
<script>
$(function() {
$('#sourcePageBtn').click( function() {
// Open popup window if not already open, and store its handle into jQuery data.
($(window).data('popup') && !$(window).data('popup').closed)
|| $(window).data('popup', window.open('popup.html','MyPopupWin'));
// Reference the popup window handle.
var wndPop = $(window).data('popup');
// Waits until popup is loaded and ready, then starts using it
(waitAndPost = function() {
// If popup not loaded, Wait for 200 more milliseconds before retrying
if (!wndPop || !wndPop['ready'])
setTimeout(waitAndPost, 200);
else {
// Logic to post (pass args) and display result in popup window...
// POST args name=John, time=2pm to the process.aspx page...
$.post('process.aspx', { name: "John", time: "2pm" }, function(data) {
// and display the response in the popup window <P> element.
$('p',wndPop.document).html(data);
});
}
})(); //First call to the waitAndPost() function.
});
});
</script>
</body>
</html>
popup.html
这是从主页定位的弹出窗口。您将在主页的 jQuery 脚本中看到对 popup.html 的引用。
在弹出窗口 DOM 最终加载时设置 window['ready'] = true 有一个“技巧”。主脚本一直检查并等待此弹出窗口准备好。
<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
</head>
<body>
<!-- The example P element to display HTTP response inside -->
<p>page is loaded</p>
</body>
<script>
$(function() {
window['ready'] = true;
});
</script>
</html>
process.aspx.cs(C# - ASP.NET process.aspx 页面)
主页面脚本将参数发布到的动态服务器页面。
AJAX 参数到达Page.Request 集合。
对于本示例,输出以纯文本形式返回,但您可以根据应用要求自定义响应。
public partial class process : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
// Access "name" argument.
string strName = Request["name"] ?? "(no name)";
// Access "time" argument.
string strTime = Request["time"] ?? "(no time)";
Response.ContentType = "text/plain";
Response.Write(string.Format("{0} arrives at {1}", strName, strTime));
}
protected override void Render(System.Web.UI.HtmlTextWriter writer) {
// Just to suppress Page from outputting extraneous HTML tags.
//base.Render(writer); //don't run.
}
}
此结果由原始/主页显示到弹出窗口中。
所以弹出窗口的内容被"[name] arrives at [time]"覆盖了
主要参考文献:HTTP Made Really Easy、jQuery Ajax members and examples.