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的更多相关文章

  1. 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  2. window.open() & iframe

    window.open() & iframe https://www.w3schools.com/jsref/met_win_open.asp window.open(URL, name, s ...

  3. iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  4. window.frames && iframe 跨页面通信

    1.定义 frames[]是窗口中所有命名的框架组成的数组.这个数组的每个元素都是一个Window对象,对应于窗口中的一个框架. 2.用法 假设iframe 是一个以存在的 iframe 的 ID 和 ...

  5. js实现跨域(jsonp, iframe+window.name, iframe+window.domain, iframe+window.postMessage)

    一.浏览器同源策略 首先我们需要了解一下浏览器的同源策略,关于同源策略可以仔细看看知乎上的一个解释.传送门 总之:同协议,domain(或ip),同端口视为同一个域,一个域内的脚本仅仅具有本域内的权限 ...

  6. js 跨域复习 window.name | window.domain | iframe | Jsonp

    引起跨域的原因: 浏览器的同源策略,但是当你要发送请求的时候,出于安全性问题,浏览器有严格的要求,必须协议,域名,端口都相同,这个就是同源策略. 影响:a通过js脚本向b发送ajax请求,不同源就会报 ...

  7. window.frames[iframe].document 在ie可以用,在360、火狐中都不兼容?

    <iframe id="myf" scrolling="auto" frameborder="0" src="" ...

  8. 利用window.name+iframe跨域获取接口数据

    最近做了一个表单广告,需要从接口读取数据,做完发现谷歌火狐下正常,360兼容和IE浏览器无法获取数据,以下是鲜明的对比:      调试发现报错了: 然后开发把接口改成支持windowname,一开始 ...

  9. js控制父子页面传值(iframe和window.open)

    在html中,window对象代表浏览器中一个打开的窗口,就像我们C/S中做窗体一样,在该页的window对象就是new了一个新的窗体对象. 就像做C/S开发一样,浏览器是一个软件,每一个网页都是它n ...

随机推荐

  1. springboot~configserver里对重要信息进行RSA加密

    简介 参考:https://springcloud.cc/spring-cloud-dalston.html#_encryption_and_decryption_2 RSA非对称加密有着非常强大的安 ...

  2. 实体继承与@Builder注解共存

    在面向对象的设计里,继承是非常必要的,我们会把共有的属性和方法抽象到父类中,由它统一去实现,而在进行lombok时代之后,更多的打法是使用@Builder来进行对象赋值,我们直接在类上加@Builde ...

  3. [开源]基于Log4Net简单实现KafkaAppender

    背景 基于之前基于Log4Net本地日志服务简单实现 实现本地日志服务,但是随着项目开发演进,本地日志服务满足不了需求,譬如在预发布环境或者生产环境,不可能让开发人员登录查看本地日志文件分析. Kaf ...

  4. centos安装jenkins

    1.安装jdk yum install java java -version 2.安装jenkins 添加Jenkins库到yum库,Jenkins将从这里下载安装. wget -O /etc/yum ...

  5. JavaScript基础-3

    3 运算符 按照个数分类可分为:一元运算符.二元运算符.三元运算符: 按照功能分类可分为:算数运算符.自增运算符.比较运算符.逻辑运算符.赋值运算符: 3.1 算数运算符 算术运算符包含了加减乘除,符 ...

  6. offsetLeft 解析

    前言:先看下w3c与之相关的介绍: element.offsetHeight 返回元素的高度. element.offsetWidth 返回元素的宽度. element.offsetLeft 返回元素 ...

  7. Java实现"命令式"简易文本编辑器原型

    源自早先想法, 打算从界面方向做些尝试. 找到个简单文本编辑器的实现: Simple Text Editor - Java Tutorials. 原本的菜单/按钮界面如下. 包括基本功能: 新建/打开 ...

  8. Windows下创建ArcGIS Server站点

    原创文章,转载须标明出处自: https://www.cnblogs.com/gisspace/p/8126261.html ------------------------------------- ...

  9. 【English】十六、时间相关

    〇.其他 date: I have a date with her tomarrow. n.约会;日期,日子;时代,年代; vt.过时;使…显老;显示出…时代(或年龄);鉴定…的年代 vt.& ...

  10. base64图片存储

    将图片转换为Base64编码,可以让你很方便地在没有上传文件的条件下将图片插入其它的网页.编辑器中. 这对于一些小的图片是极为方便的,因为你不需要再去寻找一个保存图片的地方. Base64编码在ora ...