JavaScript
Cheryl71
这个作者很懒,什么都没留下…
展开
-
前端滚动懒加载
js实现懒加载原创 2022-06-01 16:28:36 · 2735 阅读 · 0 评论 -
修改input默认样式
思路:由于input的修改起来非常麻烦,所以我们在外层放置一个div,设置定位,将input样式设置为完全透明,大小为父元素大小,目标样式写在a里。此时显示的样式为a的样式,点击上传会触发input的方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">.原创 2021-12-07 10:11:05 · 1496 阅读 · 0 评论 -
h5使用js上传图片并回显,h5使用vant-ui上传图片并回显
1. h5+js上传图片并回显2. h5+js+vue.js上传图片并回显3. h5+ vue.js+vant-ui上传图片并回显原创 2021-12-06 17:49:08 · 917 阅读 · 0 评论 -
根据身份证号获取出生日期、性别、年龄
function getBirthdatByIdNo(UUserCard, num) { if(num == 1) { //获取出生日期 var birth = UUserCard.substring(6, 10) + "-" + UUserCard.substring(10, 12) + "-" + UUserCard.substring(12, 14); return birth; } if(num == 2) { //获取性别 if(parseInt(UUserCard.su原创 2021-11-25 16:30:46 · 396 阅读 · 0 评论 -
js从url中提取参数值
如上图所示,需从url中提取cardId的值408952,用于页面显示。思路:使用js封装一个方法,从url中取出参数值,实现代码如下:function getCardId(queryName) { let query = decodeURI(window.location.search.substring(1)); // search:?后的参数值,包括? let vars = query.split("&"); for (let i = 0; i < vars.原创 2021-10-19 16:22:50 · 207 阅读 · 0 评论 -
js实现一键换肤效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>一键换肤</ti原创 2021-09-18 16:52:19 · 579 阅读 · 0 评论 -
使用v-model绑定数据,使用js传参赋值未成功
使用v-model绑定数据,使用event.target赋值未成功<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale.原创 2021-09-17 11:45:19 · 803 阅读 · 0 评论 -
前端进行身份证验证(详细)
idNum(id,oldVal){ if(id.length==18){ this.sex=""; this.birthday=""; // 1 "验证通过!", 0 //校验不通过 // id为身份证号码 var format = /^(([1][1-5])|([2][1-3])|([3][1-7])|([4][1-6])|([5][0-4])|([6][1-5])|([7][1])|([8][1-2]))\d{4}(([1][9]\d{2})原创 2021-09-13 22:35:16 · 2137 阅读 · 0 评论 -
正则匹配将字符串除首位和末尾以外的字符显示为*
function tostar(str) { let reg; reg = str[0] + '*'.repeat(str.length - 2) + str[str.length - 1]; return reg;}tostar('k193839170'); //k********0原创 2021-09-06 15:34:18 · 702 阅读 · 0 评论 -
前端使用filter实现关键词查询
如下图所示,期望实现关键词查询<template> <el-table :data="tableData" style="width: 100%"> <el-table-column label="Date" prop="date"> </el-table-column> <el-table-column label="Name" prop="name"> </el-table-column> <e原创 2021-05-28 15:31:13 · 750 阅读 · 0 评论 -
js转换数据格式
{ 2018: [ {year: "2018", season: "4"}, {year: "2018", season: "1"}, {year: "2018", season: "3"}, {year: "2018", season: "2"} ]}需要数据转换成下面的形式{ season: ["4", "1", "3", "2"] year: "2018"}//方法1let obj = response.data;let arrs = []for (原创 2021-05-13 16:54:20 · 320 阅读 · 0 评论 -
js取出数组a里面的key 并组成新的数组
var val = [ { year: '2021', month: [ {dateRange:"1-3月", start: "2021-01-01", end: "2021-03-31"} ] }, { year: '2020', month: [ {dateRange:"1-3月", start: "2020-01-01", end: "2020-03-原创 2021-05-12 15:25:46 · 1010 阅读 · 2 评论 -
封装公共函数转换new Date( )为yyyy-mm-dd
function dateToday(datetime) { var year = datetime.getFullYear();//获取完整的年份(4位,如:1970) var month = datetime.getMonth() + 1;//获取月份(返回0-11,0代表1月,用的时候记得加上1) var date = datetime.getDate();//获取日(返回1-31) //判断小于等于9月的时候在月份前加一个"0" if (month <原创 2021-05-12 10:13:09 · 130 阅读 · 0 评论 -
前后台实现编辑操作
前端 js后端 php+laravel5.6点击编辑按钮,跳出弹框<template> <b-modal ref="editModalRef" centered @ok="handleEditOk" title="案例修改" ok-title="提交" cancel-title="取消" ok-variant="primary" > <div class="form-group ro原创 2021-05-12 10:02:25 · 212 阅读 · 0 评论 -
登录权限
/ 计算动态路由export function createRoutes() { let role = localStorage.getItem("role"); let dynamicRoutes = calcuRoutes(allRoutes, role); // 使用内置方法挂载 动态路由 router.addRoutes(dynamicRoutes); // 得到对应的角色可见的route对象 let visibleMenu = calcuVisibleMenu(dyn原创 2021-05-11 10:30:51 · 160 阅读 · 0 评论 -
前后台上传数据至数据库
如图,在input框内输入内容后,点击确认录入,传递数据给后台,后台接收后上传到数据库。前端代码<b-modal id="modal-add-task" ref="modal" title="案例录入" @ok="handleOk" @hidden="resetModal" ok-title="确认录入" cancel-title="取消"> <form ref="form" @submit.stop.prevent="handleSubmit"> &.原创 2021-05-10 18:01:38 · 722 阅读 · 0 评论 -
v-for绑定v-model
原html<form ref="form" @submit.stop.prevent="handleSubmit"> <b-form-group v-for="(item, index) in addTaskForm" :key="index" :label="item.label" :label-for="item.labelFor" :invalid-feedback="item.invalidFe原创 2021-04-29 14:39:41 · 508 阅读 · 1 评论 -
js将对象转换为数组
数据形式task = [ { name: "test1", group: { 1: { phase: { "Start": { status: "Wait", complete_time: "2021-04-12 12:12:12", msg: "", }, "Finish": { status: "Wa原创 2021-04-25 12:40:21 · 249 阅读 · 0 评论 -
前后端上传文件至服务器
<div > <input type="file" name="files" id="files" multiple accept="application/pdf" enctype="multipart/form-data" > <button onclick="uploadFile()">上传</button></div>var files = document.getE原创 2021-03-25 17:36:04 · 261 阅读 · 0 评论 -
filter加正则返回数据
var file = [ { name: "2019.10.31 xxxxx.pdf" }, { name: "Jxxxxx.pdf" }, { name: "2021-03《xxxx》yyyyy.pdf" }];var strRegex = /^(\d{4}-\d{2})/;// 返回以yyyy-mm开始,以.pdf为后缀的文件const reg = /^\d{4}\-\d{2}.+(.pdf)$/原创 2021-03-24 18:44:36 · 234 阅读 · 0 评论 -
使用filter过滤数据
如何筛选掉无效数据?今天在做遍历20个数据时,需要判断后台返回的数据是否含user字段,有则遍历,无则跳过,如何实现呢?刚开始想复杂了,我的做法是,用数组arr1, arr2分别来装,第一个装10个, 第二个再装10个。在遍历时,判断是否存在该字段if (this.projects[i]["user"])但此种方法无法判断第二次遍历从后台数组的index起始值,后面想到可以先过滤掉数据,再遍历。如何通过js筛选掉无效数据呢?有以下两种方法假定arr是后台返回的数据,此时存在无效数据,方法原创 2021-03-24 16:42:22 · 1484 阅读 · 0 评论 -
JavaScript 严格模式(use strict)
在严格模式中,js不能使用未提升的变量,通过在函数头部添加use strict来表明严格模式必须先声明再赋值不允许删除变量或(对象)函数Object.defineProperty()会在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回对象**语法: Object.defineProperty(obj, prop, descriptor)**obj: 属性prop: 定义的属性descriptor: 描述符在严格模式中,禁止对.原创 2021-03-05 19:55:28 · 98 阅读 · 0 评论 -
JS变量提升及常见误区
js变量提升JavaScript 中,函数及变量的声明都将被提升到函数的最顶部。变量可以在使用后声明也可以先使用再声明。只有声明的变量会提升,初始化的不会。也就是说,未赋值的变量,提升为undefined。常见js使用误区switch 语句会使用恒等计算符(===)进行比较:var x = 10;switch(x) { case "10": alert("Hello");}此处不执行弹窗,类型与值都相等才匹配成功。特别注意浮点型数据;var x = 0.1;var原创 2021-03-05 19:50:43 · 131 阅读 · 0 评论 -
Js数据类型及检测方法
Js数据类型:检测变量数据类型如果对象是 JavaScript Array 或 JavaScript Date ,我们就无法通过 typeof 来判断他们的类型,因为都是 返回 object。可以通过constructor来查看JavaScript Array 或 JavaScript DateUndefined, null无法通过.constructor 判断Js类型转换将数字转化未字符串全局方法 String() 可以将数字转换为字符串。该方法可用于任何类型的数字,字母,变量,原创 2021-02-23 19:14:16 · 96 阅读 · 0 评论 -
js对象和变量
js对象var person = { firstName: "John", lastName : "Doe", id : 5566, fullName : function() { return this.firstName + " " + this.lastName; }};对象属性有两种寻址方式:name=person.lastname;name=person["lastname"];访问对象方法:返回函数执行结果pers原创 2021-02-23 19:09:34 · 435 阅读 · 0 评论 -
js封装请求方法
参考axios中文文档封装公共请求函数function sendGetReq(params, url, callback) { let request = { params: params }; let promise = axios.get(url, request) promise.then((response)=>{ callback(response) }).catch(error=>{ console.log(error); })}原创 2021-02-20 16:14:50 · 633 阅读 · 0 评论 -
JavaScript sort() 方法比较数据并排序
参考文档数据1数据2206/200160/156689/692355/362126/108112/98function compare(a, b) { if (a is less than b by some ordering criterion) { return -1; } if (a is greater than b by the ordering criterion) { return 1; } // a must原创 2021-02-19 13:17:39 · 291 阅读 · 0 评论