window.open()实现post传递参数


Posted in Javascript onMarch 12, 2015

在实际项目中,常常遇到这样的需求,即实现子系统页面之间跳转并在新的页面打开,我所在项目组使用的是SSH框架,所以url均为类似****.action,同时还带有两参数(系统ID与系统名称),两个参数被struts拦截后存入session中,在打开的子系统页面中还有个ztree插件实现的树状菜单需要参数系统ID才能初始化,直接使用window.open(url,"_blank"),会使得url长度过长,同时还暴露一些参数。故想改用post方式提交,隐藏提交过程中参数的传递。首先想到ajax提交,但是两个参数的传递会存在问题,ajax提交与window.open()会使得action走两遍,因此舍去。后又重新认真看了window.open()的API,链接地址http://www.w3school.com.cn/jsref/met_win_open.asp。window.open()默认是get提交方式,想要实现post提交方式,还得另想它法。参考https://3water.com/article/32826.htm,这里介绍了一种方法。也是常被采用的方法。我根据实际情况略作修改:

function openPostWindow(url, name, data1, data2){

    var tempForm = document.createElement("form");

    tempForm.id = "tempForm1";

    tempForm.method = "post";

    tempForm.action = url;

    tempForm.target=name;

    var hideInput1 = document.createElement("input");

    hideInput1.type = "hidden";

    hideInput1.name="xtid";

    hideInput1.value = data1;

    var hideInput2 = document.createElement("input");

    hideInput2.type = "hidden";

    hideInput2.name="xtmc";

    hideInput2.value = data2;

    tempForm.appendChild(hideInput1);

    tempForm.appendChild(hideInput2);

    if(document.all){

        tempForm.attachEvent("onsubmit",function(){});        //IE

    }else{

        var subObj = 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);

}

//function openWindow(name){

//    window.open("",name);

//}

 openPostWindow()函数中的参数个数根据实际需要自行修改。data1与data2为action需要传递的参数。此外,此处还需考虑Javascript事件浏览器兼容问题。我这里注释了function openWindow(),不然会多打开一个空白页面(about:blank)。这样基本满足需求了。

以上就是本文分享的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
JavaScript组合拼接字符串的效率对比测试
Nov 06 Javascript
JavaScript模拟深蓝vs卡斯帕罗夫的国际象棋对局示例
Apr 22 Javascript
Jquery注册事件实现方法
May 18 Javascript
js生成随机颜色方法代码分享(三种)
Dec 29 Javascript
Angular中实现树形结构视图实例代码
May 05 Javascript
jQuery实现返回顶部按钮和scroll滚动功能[带动画效果]
Jul 05 jQuery
Angular学习教程之RouterLink花式跳转
May 03 Javascript
微信小程序发送短信验证码完整实例
Jan 07 Javascript
通过javascript实现段落的收缩与展开
Jun 26 Javascript
浅谈Vue SSR中的Bundle的具有使用
Nov 21 Javascript
JS 事件机制完整示例分析
Jan 15 Javascript
Vue使用screenfull实现全屏效果
Sep 17 Javascript
js运动动画的八个知识点
Mar 12 #Javascript
js实现最短的XML格式化工具实例
Mar 12 #Javascript
微信中一些常用的js方法汇总
Mar 12 #Javascript
javascript实现checkBox的全选,反选与赋值
Mar 12 #Javascript
jQuery通过扩展实现抖动效果的方法
Mar 11 #Javascript
jQuery实现字符串按指定长度加入特定内容的方法
Mar 11 #Javascript
jquery利用命名空间移除绑定事件的方法
Mar 11 #Javascript
You might like
PHP 各种排序算法实现代码
2009/08/20 PHP
php+ajax实现无刷新动态加载数据技术
2015/04/28 PHP
php5.4传引用时报错问题分析
2016/01/22 PHP
PHPExcel中文帮助手册|PHPExcel使用方法(分享)
2017/06/09 PHP
php连接MSsql server的五种方法总结
2018/03/04 PHP
PHP面向对象五大原则之接口隔离原则(ISP)详解
2018/04/04 PHP
PHP实现随机发扑克牌
2020/04/22 PHP
Jquery实现仿腾讯微博发表广播
2014/11/17 Javascript
深入理解JavaScript系列(27):设计模式之建造者模式详解
2015/03/03 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
2017/07/24 Javascript
vue系列之动态路由详解【原创】
2017/09/10 Javascript
vue实现简单的MVVM框架
2018/08/05 Javascript
python编写简单爬虫资料汇总
2016/03/22 Python
python安装PIL模块时Unable to find vcvarsall.bat错误的解决方法
2016/09/19 Python
浅谈编码,解码,乱码的问题
2016/12/30 Python
Python中文件I/O高效操作处理的技巧分享
2017/02/04 Python
python3+PyQt5实现自定义窗口部件Counters
2018/04/20 Python
Python变量类型知识点总结
2019/02/18 Python
详解Python self 参数
2019/08/30 Python
tensorflow之变量初始化(tf.Variable)使用详解
2020/02/06 Python
Python 将 QQ 好友头像生成祝福语的实现代码
2020/05/03 Python
皇家道尔顿官网:Royal Doulton
2017/12/06 全球购物
英格兰足协官方商店:England Store
2019/07/12 全球购物
乌克兰在线商店的价格比较:Price.ua
2019/07/26 全球购物
Chain Reaction Cycles俄罗斯:世界上最大的在线自行车商店
2019/08/27 全球购物
英国第一独立滑雪板商店:The Snowboard Asylum
2020/01/16 全球购物
描述内存分配方式以及它们的区别
2016/10/15 面试题
某/etc/fstab文件中的某行如下: /dev/had5 /mnt/dosdata msdos defaults,usrquota 1 2 请解释其含义
2013/04/11 面试题
最新大学生自我评价
2013/09/24 职场文书
自动化职业生涯规划书范文
2014/01/03 职场文书
小学学校评估方案
2014/06/08 职场文书
证券公司客户经理岗位职责
2015/04/09 职场文书
中秋节主题班会
2015/08/14 职场文书
2019年暑期安全广播稿!
2019/07/03 职场文书
AudioContext 实现音频可视化(web技术分享)
2022/02/24 Javascript
Redis基本数据类型List常用操作命令
2022/06/01 Redis