window.open() & iframe & tab
window.open() & iframe & tab
window.open() open pages in the same window / tab
https://stackoverflow.com/questions/8454510/open-url-in-same-window-and-in-same-tab
https://developer.mozilla.org/zh-CN/docs/Web/API/Window/open
https://developer.mozilla.org/zh-CN/docs/Web/API/Window/open#Syntax
autoOpenAlink(e) {
e.preventDefault();
let url = this.url;
window.open(url, "iframe 测试页面");
// window.open(url, "_self");
},
https://medium.com/the-metric/links-should-open-in-the-same-window-447da3ae59ba
https://www.runoob.com/jsref/met-win-open.html
bug
vue & qrcode
https://www.cnblogs.com/xgqfrms/p/10715627.html
https://github.com/soldair/node-qrcode#es6es7
https://www.npmjs.com/package/qrcode#es6es7
const QRCode = require("qrcode");
setTimeout(() => {
// const QRCode = require("qrcode");
let canvas = document.getElementById("qrcode_canvas");
let url = this.url;
QRCode.toCanvas(
canvas,
url,
function (error) {
if (error) {
console.error(error);
} else {
console.log("success!");
}
}
);
}, 0);
import QRCode from 'qrcode'
// With promises
QRCode.toDataURL('I am a pony!')
.then(url => {
console.log(url)
})
.catch(err => {
console.error(err)
})
// With async/await
const generateQR = async text => {
try {
console.log(await QRCode.toDataURL(text))
} catch (err) {
console.error(err)
}
}
canvas
canvas width height
https://developer.mozilla.org/zh-CN/docs/Web/API/Canvas_API
setTimeout(() => {
// const QRCode = require("qrcode");
let canvas = document.getElementById("qrcode_canvas");
canvas.width = 100;
canvas.height = 100;
let url = this.url;
QRCode.toCanvas(
canvas,
url,
function (error) {
if (error) {
console.error(error);
} else {
console.log("success!");
}
}
);
}, 0);
https://stackoverflow.com/questions/4938346/canvas-width-and-height-in-html5
solution
https://github.com/soldair/node-qrcode#width
https://github.com/soldair/node-qrcode#options
setTimeout(() => {
// const QRCode = require("qrcode");
let canvas = document.getElementById("qrcode_canvas");
// canvas.width = 100;
// canvas.height = 100;
// canvas.style.width = "100px";
// canvas.style.height = "100px";
let url = this.url;
QRCode.toCanvas(
canvas,
url,
{
width: 120,
},
function (error) {
if (error) {
console.error(error);
} else {
console.log("success!");
}
}
);
}, 0);
ok

window.open() & iframe & tab的更多相关文章
- 利用window.name+iframe跨域获取数据详解
详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...
- window.open() & iframe
window.open() & iframe https://www.w3schools.com/jsref/met_win_open.asp window.open(URL, name, s ...
- iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解
详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...
- window.frames && iframe 跨页面通信
1.定义 frames[]是窗口中所有命名的框架组成的数组.这个数组的每个元素都是一个Window对象,对应于窗口中的一个框架. 2.用法 假设iframe 是一个以存在的 iframe 的 ID 和 ...
- js实现跨域(jsonp, iframe+window.name, iframe+window.domain, iframe+window.postMessage)
一.浏览器同源策略 首先我们需要了解一下浏览器的同源策略,关于同源策略可以仔细看看知乎上的一个解释.传送门 总之:同协议,domain(或ip),同端口视为同一个域,一个域内的脚本仅仅具有本域内的权限 ...
- js 跨域复习 window.name | window.domain | iframe | Jsonp
引起跨域的原因: 浏览器的同源策略,但是当你要发送请求的时候,出于安全性问题,浏览器有严格的要求,必须协议,域名,端口都相同,这个就是同源策略. 影响:a通过js脚本向b发送ajax请求,不同源就会报 ...
- window.frames[iframe].document 在ie可以用,在360、火狐中都不兼容?
<iframe id="myf" scrolling="auto" frameborder="0" src="" ...
- 利用window.name+iframe跨域获取接口数据
最近做了一个表单广告,需要从接口读取数据,做完发现谷歌火狐下正常,360兼容和IE浏览器无法获取数据,以下是鲜明的对比: 调试发现报错了: 然后开发把接口改成支持windowname,一开始 ...
- js控制父子页面传值(iframe和window.open)
在html中,window对象代表浏览器中一个打开的窗口,就像我们C/S中做窗体一样,在该页的window对象就是new了一个新的窗体对象. 就像做C/S开发一样,浏览器是一个软件,每一个网页都是它n ...
随机推荐
- 【Python3爬虫】教你怎么利用免费代理搭建代理池
一.写在前面 有时候你的爬虫刚开始的时候可以正常运行,能够正常的爬取数据,但是过了一会,却出现了一个“403 Forbidden",或者是”您的IP访问频率太高“这样的提示,这就意味着你的I ...
- vue-cli3安装过程
作为一个本来是java开发的搬运工,在公司前端人员缺乏的时候,就直接顶上来开发前台页面了(话说我已经很久很久没写java代码了(:′⌒`)) 好吧言归正传,刚开始弄前台就是vue,vue2还没弄熟,老 ...
- element-ui 动态换肤
1.在安装好 element-ui@2.x 以后,首先安装sass-loader npm i sass-loader node-sass -D 2.安装 element-theme npm i ele ...
- 通过 UI 管理 docker
Docker 正在被用在越来越多的场景中,对于不太习惯命令行工具的朋友来说,docker cli 用起来可能会比较吃力.本文笔者将介绍一个功能强大的 docker web 客户端:portainer( ...
- SLAM+语音机器人DIY系列:(二)ROS入门——10.在实际机器人上运行ROS高级功能预览
摘要 ROS机器人操作系统在机器人应用领域很流行,依托代码开源和模块间协作等特性,给机器人开发者带来了很大的方便.我们的机器人“miiboo”中的大部分程序也采用ROS进行开发,所以本文就重点对ROS ...
- 杭电ACM2020--绝对值排序
输入n(n<=100)个整数,按照绝对值从大到小排序后输出.题目保证对于每一个测试实例,所有的数的绝对值都不相等. Input 输入数据有多组,每组占一行,每行的第一个数字为n,接着是n个整 ...
- 个人对【依赖倒置(DIP)】、【控制反转(IOC)】、【依赖注入(DI)】浅显理解
一.依赖倒置(Dependency Inversion Principle) 依赖倒置是面向对象设计领域的一种软件设计原则.(其他的设计原则还有:单一职责原则.开放封闭原则.里式替换原则.接口分离原则 ...
- 输入框中的空"",0,null的判断
改了一个小项目,里面有一个小的问题他们是这样提需求的.两个输入框,第一个输入框里面,输入的内容会对第二个输入框中的内容产生影响.具体是这样的:如果第一个输入框中的值不是“0”,那么第二个输入框就不能填 ...
- 【土旦】 使用Vant 的Uploader 上传图片 重定义返回格式 使用FormData格式提交
前言 开发一个图片上传功能 需求要用vant中的Uploader , 发现 Uploader组件官方封装返回的数据是加密的,不适合我这个项目(需要上传到本地ftp服务器), 看了一下官方 issue ...
- 常见的7种XSS
1. URL Reflection 当URL以某种方式反映在源代码中时,我们可以添加自己的XSS向量/有效负载.对于PHP页面,可以使用斜杠字符(/)在页面名称之后添加任何内容 http://brut ...