vue如何使用window.open打开页面并拼接参数
目录
- 使用window.open打开页面并拼接参数
- 使用window.open()参数详解
- 1.window.open()有三个参数
- 2.举例说明
- 3.第二个参数详解
- 4.第三个参数详解
使用window.open打开页面并拼接参数 window.open常用来在项目中链接外部网站,接收三个参数
1.strUrl,要打开的页面或资源的url地址
2.strWindowName,窗口的名字,用于后续对该窗口的引用,不是窗口的标题。该参数除了支持普通的名字外,还支持和a标签一样的特殊关键字:_self(当前窗口)、_blank(空白窗口)、_parent(父窗口)、_top(顶级窗口)
3.strWindowFeatures,窗口的描述参数,如尺寸、位置、是否启用工具栏等。各个参数由逗号隔开,参数之间以等号连接。可以指定窗口的大小和位置。
如果需要在地址后拼接参数,可以对地址使用转义字符,使用${}拼接参数。
window.open(`http://cams.mof.gov.cn/am-server/#/MigrtDetailInfo?d=${this.currentId}`, '_blank','top=10,left=10,width=400,height=200')
使用window.open()参数详解 打开新窗口有多种情况:
- ①在当前页面弹出新窗口
- ②在浏览器新打开一个标签页
- ③替换当前页面
1.window.open()有三个参数
windows.open("URL","name","configuration");
URL
:为要新打开页面的urlname
:为新打开窗口的名字,可以通过此名字获取该窗口对象configuration
:为新打开窗口的一些配置项,比如是否有菜单栏、滚动条、长高等等信息
2.举例说明
新打开一个没有菜单栏、标题栏、工具栏,但是有滚动条、状态栏、地址栏且可伸缩窗口
window.open(//第一个参数"index.html", //第二个参数"newWindow",//第三个参数 "width=1024, height=700, top=0, left=0, titlebar=no, menubar=no, scrollbars=yes, resizable=yes, status=yes, , toolbar=no, location=yes");
window.open
弹出新窗口的命令;‘index.html’
弹出窗口的文件名;‘newWindow’
弹出窗口的名字(不是文件名),非必须,可用空’'代替;width=1024
窗口宽度;height=700
窗口高度;top=0
窗口距离屏幕上方的象素值;left=0
窗口距离屏幕左侧的象素值;titlebar=no
是否显示标题栏,被忽略,除非调用HTML应用程序或一个值得信赖的对话框.默认值是yes;menubar=no
表示菜单栏,默认值是yes;scrollbars=yes
是否显示滚动条,默认值是yes;resizable=no
是否允许改变窗口大小,默认值是yes;status=no
是否要添加一个状态栏,默认值是yes;toolbar=no
是否显示工具栏,默认值是yes;location=no
是否显示地址栏,默认值是yes;
3.第二个参数详解
_blank
表示新开一个窗口_parent
表示父框架窗口_self
表示覆盖该窗口
4.第三个参数详解
①window.open(url)或者window.open(url, name),其中name为_blank
标准浏览器、新标签打开链接url
②window.open(url, name, configration)
只要配置了configration,都是新窗口打开链接的
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
推荐阅读
- react+tsx中使用better-scroll详解
- 《决断力》
- 数学建模用python好吗_数模算法(如何使用python完成数学建模常见算法)
- DAY14—如何做选择,才能不辜负自己的努力
- uniapp|uniapp(微信小程序使用高德地图进行坐标反解析获取详细地址)
- Uni-app|uniapp 小程序中使用逆地址解析 获取当前详细地址
- 项目研发如何从全局出发来考虑项目成本的控制
- 社群运营如何有个漂亮的开端(上篇)
- 单片机|猿创征文 | 实验一 单片机keil51软件使用及IO控制
- springBoot|springBoot之如何搭建第一个简单的springBoot项目(Hello World)