// 金额只能输入数字
inputCheck(amount){
let pattern = /(^[0-9]{1,10}$)|(^d{1,10}.$)|(^d{1,10}.d+)$/;
if(!pattern.test(amount)){
amount = parseFloat(amount) > 0 ? parseFloat(amount) : null ;
}
return amount
}
实例代码请进入详情页面,下面是其他网上介绍
音频API => AudioContext
https://www.jianshu.com/p/ee1ad766d8a7var loader = new resLoader({
resources : [
'http://p2.qhimg.com/t01ed1438874f940dc0.jpg',
'http://p9.qhimg.com/t01b4ff03b72c7dc6c7.jpg',
],
onStart : function(total){
console.log('start:'+total);
},
onProgress : function(current, total){
console.log(current+'/'+total);
var percent = current/total*100;
$('.progressbar').css('width', percent+'%');
$('.progresstext .current').text(current);
$('.progresstext .total').text(total);
},
onComplete : function(total){
alert('加载完毕:'+total+'个资源');
}
});
loader.start();
// 绘制图片
drawImg() {
// 创建图片基本属性
let canvas = document.createElement('canvas');
let ctx = canvas.getContext('2d');
let __width = 110 * 4;
let __height = 145 * 4;
canvas.width = __width;
canvas.height = __height;
// 图片背景色
ctx.fillStyle = "#FFF";
ctx.fillRect(0, 0, __width, __height);
// 加载 第一张图片
var imgCode = new Image();
imgCode.src = document.getElementById('qrcodeImg').querySelector('img').src;
imgCode.onload = function() {
// 绘制 第一张图片
ctx.drawImage(imgCode, __width * 0.25, __height * 0.4, __width * 0.5, __width * 0.5);
// 加载 第二张图片 LOGO
var imgLogo = new Image();
imgLogo.src = imgLogo.src = document.getElementById('logoImg').src;
imgLogo.onload = function() {
// 绘制 第二张图片 LOGO
ctx.drawImage(imgLogo, __width * 0.15, __width * 0.1, __width * 0.7, __width * 0.35);
// 文本绘制
ctx.font = 5 * 4 + "px Arial";
ctx.fillStyle = '#333'; // 文字颜色
ctx.textAlign = 'center'; // 文本水平对齐方式
// ctx.textBaseline='middle'; // 文本垂直方向,基线位置
ctx.fillText(lang.shareUrlImgText, __width * 0.5, __height * 0.9); // 创建文字,控制文件的起始位置
// let imgdata = ctx.getImageData(0, 0, canvas.width, canvas.height);
// ctx.putImageData(imgdata, 0, 0);
// 得到图片src数据
let baseImgData = canvas.toDataURL();
// 图片src赋值
document.getElementById('sharePhoto').src = baseImgData;
}
}
}
var obj = document.querySelector(cssselecter);
var obj = document.querySelectorAll(cssselecter);
querySelector 和 querySelectorAll 方法是 W3C Selectors API 规范中定义的。他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素。两者不同的是querySelector返回的是一个匹配对象,querySelectorAll返回的一个集合(objNodeList )。用过jquery或者是zepto的应该都熟悉css选择器,就不多说了,不会的可以看看这篇:CSS选择器
目前支持他们的浏览器包括。包括 IE8(含) 以上版本、 Firefox、 Chrome、Safari、Opera等。
/* 外容器 */
.mask {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 4999;
background: rgba(0, 0, 0, 0.5);
/* 内容区 */
.cont {
position: fixed;
z-index: 5000;
width: 80%;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #FFFFFF;
text-align: center;
border-radius: 5px;
}
}
1、使用绝对路径,打包后成了 url(/static/img/logo-index.2f00bf2.png) no-repeat
2、使用相对路径,打包后成了 url(static/img/logo-index.2f00bf2.png) no-repeat
但是CSS资源里面的背景图片,不像index.html中加载资源一样,通过./static/js/app.js引用可以正常加载,解决办法,打开webpack.prod.conf.js,参考详情说明步骤,添加字段 publicPath:'../../',
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
//密码强度校验
function checkPassword3(fieldId,tipMsg){
/*
返回密码的强度级别
*/
function checkStrong(sPW) {
if (sPW.length < 8||sPW.length > 20)
return 0; //密码太短或太长
Modes = 0;
for (i = 0; i < sPW.length; i++) {
//测试每一个字符的类别并统计一共有多少种模式.
Modes |= CharMode(sPW.charCodeAt(i));
}
return bitTotal(Modes);
}
/*
判断字符类型
*/
function CharMode(iN) {
if (iN >= 48 && iN <= 57) //数字
return 1;
if (iN >= 65 && iN <= 90) //大写字母
return 2;
if (iN >= 97 && iN <= 122) //小写
return 4;
else
return 8; //特殊字符
}
/*
统计字符类型
*/
function bitTotal(num) {
modes = 0;
for (i = 0; i < 4; i++) {
if (num & 1) modes++;
num >>>= 1;
}
return modes;
}
/**
* 密码强度等级说明,字符包括:小写字母、大写字母、数字、特殊字符
* 1---密码包含其中之一
* 2---密码包含其中之二
* 3---密码包含其中之三
* 4---密码包含其中之四
*/
var fieldValue=getValue(fieldId);
if(fieldValue!=""&&checkStrong(fieldValue) < 2){
tipMsg='登录密码由8-20位数字+字母组成,字母区分大小写';
errShow(fieldId,tipMsg);
return false;
}
return true;
}