首页
壁纸
直播
留言
关于
友链
统计
Search
1
tampermonkey油猴和谷歌访问助手的安装---破解谷歌访问助手
13,642 阅读
2
安装postcss-px-to-viewport,将px单位转换为视口单位的 (vw, vh, vmin, vmax) 的 PostCSS 插件(有更新postcss弃用,附带vite.config.ts文件)
3,211 阅读
3
编译asar文件与electron反编译
3,177 阅读
4
websocket封装带心跳和重连机制(vue3+ts+vite)
2,782 阅读
5
js一些小功能(持续更新)
2,442 阅读
大前端
JavaScript
CSS
HTML
框架
Vue
electron
element-ui/plus
小程序
微信小程序
uni-app
服务端
Node.js
nginx
PHP
MySQL
工具
杂记
登录
Search
标签搜索
Vue3
Vue
Axios
微信小程序
Javascript
Vuex
js
请求
request
前端
tampermonkey
Google
助手
脚本
小程序云开发
Bootstrap
壁纸
鼠标事件
跨域
css
大祥子i
累计撰写
55
篇文章
累计收到
128
条评论
首页
栏目
大前端
JavaScript
CSS
HTML
框架
Vue
electron
element-ui/plus
小程序
微信小程序
uni-app
服务端
Node.js
nginx
PHP
MySQL
工具
杂记
页面
壁纸
直播
留言
关于
友链
统计
搜索到
2
篇与
js
的结果
2021-09-15
Vue前端模拟生成验证码并且效验功能
遇到个登陆功能需要输入验证码,后端没接口,但是为了防止机器人恶意登陆还是要写个验证码效验的,活就跑到前端来了,利用随机数写的一个4位验证码。{mtitle title="js核心代码如下"/}//定义code用于存放验证码 var code = '' // 设置长度,这里看需求,我这里设置为4 var codeLength = 4 // 设置随机字符 // 这里可以写成字母,这样就可以随机生成字母验证码了 var random = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9) // 循环codeLength 我设置的4就是循环4次 for (var i = 0; i < codeLength; i++) { // 设置随机数范围,这设置为0 ~ 36 var index = Math.floor(Math.random() * 9) // 字符串拼接 将每次随机的字符 进行拼接 code += random[index] } // 将拼接好的字符串赋值给展示的code this.code = code 效验功能就不写了,就是获取用户输入的验证码,和生成的验证码做对比,对就OK不对就告诉用户:吊毛你输入的验证码有误!{mtitle title="这里CSS对样式改进"/}/* 让验证码变形,看起来更加像一点*/ letter-spacing: 15px; transform:skew(45deg); transform: scale(1.,0.5);
2021年09月15日
633 阅读
0 评论
0 点赞
2018-12-31
js一些小功能(持续更新)
阻止浏览器回退/** * 阻止浏览器回退ts * 传的data是因为ts语法规则不允许给string赋值null * js将data改成null即可 */ const holdBack = (data: any) => { //阻止浏览器回退 if (window.history && window.history.pushState) { window.history.pushState(null, data, document.URL); window.addEventListener('popstate', () => { window.history.pushState(null, data, document.URL); }, false); } }生成6位随机字符串/** * 生成6位随机字符串 * @returns */ const randomCode = () => { let character = '' let len = 6; // 选择的生成的位数 let code = '0123456789qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASFGHJKLZXCVBNM' let maxPos = code.length; for (let i = 0; i < len; i++) { character += code.charAt(Math.floor(Math.random() * maxPos)) } return character }RegExp模糊查询/** * RegExp模糊查询 * @returns */ var list = ['nai','43q','5xn'] var keyWord = 'n' var arr = [] var reg = new RegExp(keyWord) for(var i = 0; i < list.length; i++) { if(list[i].match(reg)) { arr.push(list[i]); } } console.log(arr)两个数组对象找不同/** * 两个数组对象找不同 * @returns */ var arr1 = [ { id: 1, name: '张三' }, { id: 2, name: '张四' }, { id: 3, name: '张五' }, { id: 4, name: '张六' } ]; var arr2 = [ { id: 1, name: '李三' }, { id: 2, name: '李四' }, { id: 3, name: '李五' }, { id: 4, name: '李六' }, { id: 5, name: '张六' } ]; var result = []; for (var i = 0; i < arr2.length; i++) { var obj = arr2[i]; var num = obj.id; var isExist = false; for (var j = 0; j < arr1.length; j++) { var aj = arr1[j]; var n = aj.id; if (n == num) { isExist = true; break; } } if (!isExist) { result.push(obj); } } console.log(result);两个数组找不同/** * 两个数组找不同 * @returns */ let arr1 = ['a', 'b', 'c'] let arr2 = ['a', 'b', 'c', 'd', 'e'] let arr3 = [] for (let i = 0; i < arr2.length; i++) { let obj = arr2[i] let isExist = false; for (let k = 0; k < arr1.length; k++) { if (arr2[i] === arr1[k]) { console.log('数据',k,arr2[i] === arr1[k]) isExist = true; break } } if (!isExist) { console.log('执行我',i) arr3.push(obj); } } console.log(arr3)删除数组中指定值/** * 删除数组中指定值 * @returns */ let arr1 = ['a', 'b', 'c', 'd', 'e'] for (const index in arr1) { if (arr1[index] === 'a') { console.log('删除',arr1[index],index) arr1.splice(index, 1) } }formData上传名称问题 /** * 修改上传文件的filename * @returns */ Content-Disposition: form-data; name="signImg"; filename="我是名称" formData.append('signImg', blob, '我是名称.png');下载blob文件/** * 下载blob文件 * @returns */ function saveContent(content, fileName) { let aTag = document.createElement('a'); aTag.setAttribute('download', fileName); let blob = new Blob([content], { type: "" }); aTag.setAttribute('href', URL.createObjectURL(blob)); document.body.appendChild(aTag); aTag.click(); document.body.removeChild(aTag); } //需要注意,要设置请求responseType:'blob'正则替换关闭网页/** * 正则替换关闭网页 * @returns */ var str = "http://192.168.10.254:20000/talk/#/middle-skip?meetingId=735073733^&userId=12345678^&appId=appId123456789^&url=http://192.168.10.254:22000/butt^&fydm=法院代码^&userName=李志祥^&source=tdh" str.replace(/\&/g,"^&") console.log(str) function ClosePage() { open(location, '_self').close(); }测试上传文件/** * 测试上传文件 * @returns */ const loadFile = function (name) { // name为文件所在位置 let xhr = new XMLHttpRequest(), okStatus = document.location.protocol === "file:" ? 0 : 200; xhr.open('GET', 'C:\\Users\\12456\\Desktop\\图片\\前端转换的测试.pdf', true); xhr.overrideMimeType("text/html;charset=utf-8");//默认为utf-8 xhr.send(null); console.log(xhr.status === okStatus ? xhr.responseText : null) }筛选数字/** * 筛选出数字 * @returns */ let str = '123456aaas45sd456asdaqweqw' console.log(str.replace(/[^-](\d)-|[^\d]/ig, ''))扁平化数组(打印对象)/** * 扁平化数组 * @returns */ let arr = [ 1, [2,3,4,5,6,[7,8,[9,[10,11]]]], 12,13 ] console.log('格式化之前') console.log(arr) console.log('格式化之前') console.log('---------分割线---------') console.log('格式化之后') console.log([...new Set(arr.flat(Infinity))].sort((a,b) => a-b)) console.log('格式化之后') /** * js查询对象 * @returns */ let obj = { userId: '12345678', meetingId: '795576763', fydm: 'jsx4122', appId: 'a1a12' } console.log(obj.meetingId)数组对象合并去重/** * 数组对象合并去重 * @returns */ let arr1 = [ { id: 1, name: "aaa" }, { id: 2, name: "bbb" }, { id: 3, name: "ccc" }, ] let arr2 = [ { id: 1, name: "aaa" }, { id: 2, name: "bbb" }, { id: 4, name: "ddd" }, { id: 5, name: "eee" }, ] let arrList = arr1.concat(arr2); //两个数组对象合并 console.log('两个数组合并', arrList) let newArrList = []; //盛放去重后数据的新数组 for (item1 of arrList) { //循环arrList数组对象的内 let flag = true; //建立标记,判断数据是否重复,true为不重复 for (item2 of newArrList) { //循环新数组的内容 if (item1.id == item2.id) { //让arrList数组对象的内容与新数组的内容作比较,相同的话,改变标记为false flag = false; } } if (flag) { //判断是否重复 newArrList.push(item1); //不重复的放入新数组。 新数组的内容会继续进行上边的循环。 } } console.log('去重后的数据', newArrList)
2018年12月31日
2,442 阅读
0 评论
1,820 点赞