第一种方式
最近在做web项目，碰到需要跨页面传递参数的功能，就是那种需要把当前页面的内容带到新开的子窗体中，以前的做法是传一个id过去，然后在新窗口中去读数据库的内容。虽然不怎么麻烦，但是如果内容么有在数据库里保存，仅仅是处以拟稿状态时，就不能实现了，用户还常常认为是个bug。考虑采用get的方式传递，把需要的内容都序列化然后，通过url去传，显得很臃肿，而且get的传递内容长度有限制。于是就想到用post的方式传递，问题在于open方法不能设置请求方式，一般网页的post都是通过form来实现的。如果仅仅模拟form的提交方式，那么open方法里那种可设置窗体属性的参数又不能用。最后想办法整了这么一个两者结合的方式，将form的target设置成和open的name参数一样的值，通过浏览器自动识别实现了将内容post到新窗口中。
比较有意思的是直接通过调用form的submit方法不能触发onsubmit事件，查看了帮助文档，必须手动的触发，否则只能看到页面刷新而没有打开新窗口。代码中只传递了一个参数内容，实际可传递多个。
具体代码如下：
<script>
function openPostWindow(url, data, name)
{
var tempForm = document.createElement("form");
tempForm.id="tempForm1";
tempForm.method="post";
tempForm.action=url;
tempForm.target=name;
var hideInput = document.createElement("input");
hideInput.type="hidden";
hideInput.name= "content"
hideInput.value= data;
tempForm.appendChild(hideInput);
tempForm.attachEvent("onsubmit",function(){ openWindow(name); });
document.body.appendChild(tempForm);
tempForm.fireEvent("onsubmit");
tempForm.submit();
document.body.removeChild(tempForm);
}
function openWindow(name)
{
window.open('about:blank',name,'height=400, width=400, top=0, left=0, toolbar=yes, menubar=yes, scrollbars=yes, resizable=yes,location=yes, status=yes');
}
</script>
第二种方式
function openWindowWithPost(url,name,keys,values)
{
var newWindow = window.open(url, name);
if (!newWindow)
return false;
var html = "";
html += "<html><head></head><body><form id='formid' method='post' action='" + url + "'>";
if (keys && values)
{
html += "<input type='hidden' name='" + keys + "' value='" + values + "'/>";
}
html += "</form><script type='text/javascript'>document.getElementById('formid').submit();";
html += "<\/script></body></html>".toString().replace(/^.+?\*|\\(?=\/)|\*.+?$/gi, "");
newWindow.document.write(html);
return newWindow;
}
推荐使用第一种方式，第二种方式测试过程中发现，与日历弹出框冲突，如果子页面上有日历弹出框，则点日历框会不停刷新页面，不会弹出日历框。当然，也可能是我用的日历框的问题。
分享到：
相关推荐
使用window.open()方法发送post请求
根据实际的开发项目整理的一个window的open方法把get请求转成post请求处理方式逻辑，由于window.open方法的get实现时，请求传入的参数长度不能超过2000这样一个字符长度，故需转换成post请求处理方式达到既能用到...
第一种方式 最近在做web项目，碰到需要跨页面传递参数的功能，就是那种需要把当前页面的内容带到新开的子窗体中，以前的...如果仅仅模拟form的提交方式，那么open方法里那种可设置窗体属性的参数又不能用。最后想办法
javascript 打开页面window.location和window.open的区别.docx
代码如下: //打开新页面并利用post方式传递参数 function openNewPageWithPostData(postAddress,opentype,paramNames,paramValues) { var newWindow = window.open(postAddress,opentype); if (!newWindow) { return...
本文主要向大家介绍了如何使用window.open()实现post传递参数的方法，思路是参考的一位网友的，然后根据自己的项目需求做了些调整，这里同样分享给大家，希望对大家能够有所帮助。
window.postMessage的功能是允许程序员跨域在两个窗口/frames间发送数据信息。基本上，它就像是跨域的AJAX，但不是浏览器跟服务器之间交互，而是在两个客户端之间通信。让我们来看一下window.postMessage是如何工作...
layer.open({ id: 'LAY_layuipro', //设定一个id，防止重复弹出 type: 2, title:'添加人员信息', area: ['600px','340px'], btn: ['保存','关闭'], yes: function(index, layero){ var inputForm = $(window....
ajax异步请求 var xmlhttp; function loadHttpRequest(){ xmlhttp=null; ... xmlhttp.open("post","content.jsp",true);//打开 xmlhttp.onreadystatechange=state_Change;//回调函数
废话不多说，关键代码如下所示： jQuery.ajax({ ...会被浏览器拦截，无法打开新窗口，如果把window.open()放在ajax外面，问题就迎刃而解，代码如下： var result=""; jQuery.ajax({ "type":"post",
otherWindow: 其他窗口的一个引用, 比如IFRAME的contentWindow属性, 执行,window.open返回的窗口对象. message: 将要发送到其他窗口的数据. targetOrigin:通过窗口的origin属性来指定哪些窗口能接收到消息事件,
这两窗口之间存在着关系.父窗口parent.htm打开子窗口son.htm 子窗口可以... Post.htm <input type=text name=maintext> <input type=button onclick=”window.open(‘Read.htm’)” value=”Open”>
window.postMessage的功能是允许程序员跨域在两个窗口/frames间发送数据信息。基本上，它就像是跨域的AJAX，但不是浏览器跟服务器之间交互，而是在两个客户端之间通信。让我们来看一下window.postMessage是如何工作...
ajax回调打开新窗体防止浏览器拦截，就这么做！ 问题剖析： function click_fun(){ ... 'type': 'post', 'dataType': 'json', 'data': data, success: function (data) { window.open("www.baidu.c
Ajax最简单例子，一个例子让你明白Ajax原理，XMLHttpRequest原理 ... function createRequest(url) { ... if (window.XMLHttpRequest) { // ... http_request.open('POST', url, false); http_request.send(); }
在AngularJs中有三种方式可以设置请求头信息： 1、在http服务的在服务端发送请求时，也就是调用 http服务的在服务端发送请求时，也就是调用 http()方法时，在config对象中设置请求头信息：事例如下： $http.post('...