JS form跳转到新标签页并用post传参

今天在开发的过程中有一个需求,要求:打开一个新的页面同时传参。
这个不难实现 <a> 标签 就可以实现,但它却是使用 get方式传参,这种直接将参数拼接在 url 的方式(url + ? + 参数)是不安全的,数据直接暴露在地址栏,而且由于不同的浏览器对于地址栏的长度也有限制,导致参数也是有大小限制的。那么能不能使用 post方式传参呢? 下面就来介绍各种打开新页面以及传参的方式。
1 超链接<a>标签 (get传参)
<a href="http://www.cnblogs.com/pan1042/" target="_blank">
2 window.open() (get传参)
window.open(URL,name,specs,replace)
例: window.open(url + "? param1=value1¶m2=value2", "_blank")
3 form (post传参)
function openPostWindow(url, data, name)
{
var tempForm = document.createElement("form");
tempForm.id = "tempForm1";
tempForm.method = "post";
tempForm.action = url;
tempForm.target = name; // _blank - URL加载到一个新的窗口 var hideInput = document.createElement("input");
hideInput.type = "hidden";
hideInput.name = "content";
hideInput.value = data;
tempForm.appendChild(hideInput);
// 可以传多个参数
/* var nextHideInput = document.createElement("input");
nextHideInput.type = "hidden";
nextHideInput.name = "content";
nextHideInput.value = data;
tempForm.appendChild(nextHideInput); */
if(document.all){ // 兼容不同浏览器
tempForm.attachEvent("onsubmit",function(){}); //IE
}else{
tempForm.addEventListener("submit",function(){},false); //firefox
}
document.body.appendChild(tempForm);
if(document.all){ // 兼容不同浏览器
tempForm.fireEvent("onsubmit");
}else{
tempForm.dispatchEvent(new Event("submit"));
}
tempForm.submit();
document.body.removeChild(tempForm);
}
【参考】
- https://www.runoob.com/jsref/met-win-open.html
- https://blog.csdn.net/u013303551/article/details/52909871
JS form跳转到新标签页并用post传参的更多相关文章
- 如何设置使chrome新标签页中打开链接自动跳转到新标签页?
在新标签打开链接的时候这样点选 Ctrl+左键 或者 鼠标中键 或者 右键链接选择'新标签页中打开链接', 可实现出现新标签页但不自动跳转 但是这个有问题, 即, 新标签只是在背景打开, 操作后并不会 ...
- FireFox新标签页打开搜索和书签
FireFox更新,发现界面完全不适应,虽然他是越做越丑,但是也没办法,一直用FireFox,许多书签,保存的密码现在都记不住了,只能靠保存的自动填充.... 进入正题,FireFox更新了之后,搜索 ...
- 阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页
问题:ios封装完之后,点击里边的按钮会跳转到网页上 ——小卡遇到这个问题就是这样解决的↓↓↓ 解决方法:建议将代码放到</head>标签前,当然,另外存为一个js 文件引用也是可以的呦~ ...
- js实现在新标签页打开页面
这种方法打开新标签页要在IE9+以上浏览器才可以! <html> <head> <meta http-equiv="Content-type" con ...
- 【解决方案】chrome打开新标签页自动打开chrome://newtab并且跳转到谷歌香港
简述天,昨天开始遇到这个问题,还没有留心,结果今天多次使用chrome的时候,就发现有些不对了..打开chrome的新标签页,结果出现了自动跳转的问题我自动跳转的是下面这个网页:https://www ...
- 每天一点产品思考(5):Web端链接跳转在当前页面刷新还是新标签页打开?
一.与交互设计师的突然撕逼 今天阿白在验收产品的时候,在博客首页打开一篇博文,是在原先的页面进行刷新,而不是新开一个标签页打开.阿白让开发改成在新标签页中打开,但是开发说这是设计师设计 ...
- Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”
Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...
- HTML:模拟链接被按下,在新标签页打开页面,不使用window.open(可能被拦截)
当按下一个按钮时,想打开一个新的标签页,可以使用window.open去实现但是因为使用window.open在新窗口或者新标签页中打开页面,有可能被浏览器给拦截.为了解决这个问题,可以模拟链接被按下 ...
- (转载)HTML:模拟链接被按下,在新标签页打开页面,不使用window.open(可能被拦截)
原文: http://www.cppblog.com/biao/archive/2010/08/21/124196.html 当按下一个按钮时,想打开一个新的标签页,可以使用window.open去实 ...
随机推荐
- GDAL线面互转换(2)
在上一个文章中介绍了线转化为面和面转化为线,其主要的实现思路就是把面中的点取出来构成线,把线中的点取出来构成面,实际上就是一个硬拷贝,无奈客户的实际需求并非如此,客户想要线转面的时候几条相交线构成面, ...
- 优雅的实现多类型列表的Adapter
1引言 在开发中经常会遇到,一个列表(RecyclerView)中有多种布局类型的情况.前段时间,看到了这篇文章 [译]关于 Android Adapter,你的实现方式可能一直都有问题(http:/ ...
- exim CVE-2017-16943 uaf漏洞分析
前言 本文由 本人 首发于 先知安全技术社区: https://xianzhi.aliyun.com/forum/user/5274 这是最近爆出来的 exim 的一个 uaf 漏洞,可以进行远程代码 ...
- 网络 私有IP和子网掩码设置
私有IP不需要花钱 节约使用公网IP有两个方法,一个方法是动态IP(关机回收IP),一个方法是私有IP,尤其是私有IP作用巨大. 私有IP不具有唯一性,不能直接访问公网.比如,我以私有IP192.16 ...
- 外业数据采集平台(GPS+Android Studio+Arcgis for android 100.2.1)
外业数据采集平台 1. 综述 在室外,通过平板或者手机接收GPS坐标,实时绘制点.线.面数据,以便为后续进行海域监测.土地确权.地图绘图提供有效数据和依据. 2. 技术路线 Android studi ...
- redis介绍(7)高级用法
redis的过期策略以及内存淘汰机制 分析:这个问题其实相当重要,到底redis有没用到家,这个问题就可以看出来.比如你redis只能存5G数据,可是你写了10G,那会删5G的数据.怎么删的,这个问题 ...
- Week7——JSON
1.什么是JSON? JSON是JavaScript对象表示法,全称是JavaScript Objec Notation.它是存储和交换文本信息的语法,类似于XML.JSON是轻量级的文本数据交换格式 ...
- 关于C#线程,线程池和并行运算的简单使用和对比
转自:https://www.cnblogs.com/jeffwongishandsome/archive/2010/11/12/1876137.html 先大概看一下控制台应用程序的Main方法的主 ...
- 【Oracle】存储过程写法小例子
1.存储过程的基本语法: CREATE OR REPLACE PROCEDURE 存储过程名(param1 in type,param2 out type) IS 变量1 类型(值范围); 变量2 类 ...
- mysql-sql-standard
https://github.com/zhishutech/mysql-sql-standard