礼拜八的博客

原创 2019年个人成长计划

2019关键词：思考，成长，责任，担当2019年要做的几件事情：一.  生活与责任 1.1 三十而立，有幸在30岁前完成了结婚这件大事。希望以后自己能有足够的能力承担起一个家庭的责任。做一个有责任心的丈夫，体贴关心老婆的丈夫。改掉自己身上一些不成熟的东西，懂得控制自己情绪；2.2 出去旅游一次，见识一些各个地方的风土人情，增长一点见识，放松一些心情；3.3 每月和老婆外出...

原创 2019前端学习路线图

转载 非常全的 前端资源分享--只为更好前端

如果觉得以下内容对您有用，请收藏！！ 一、团队组织网站 说明 腾讯 AlloyTeam 团队 腾讯Web前端团队，代表作品WebQQ，致力于前端技术的研究 ISUX 腾讯社交用户体验设计，简称ISUX，腾讯设计团队网站 CDC 腾讯用户研究与体验设计部 FEX 百度Web前端研发部出品 淘宝前端团队（FED） 用技术为体验提供无限...

原创 2022-10车载音乐分享

粤语经典珍藏、华语经典流行、经典怀旧、网络情歌、抖音热门歌曲、劲爆DJ等，种类齐全！

原创 密码强度正则

密码强度正则，最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符，特殊字符只能是!@$%^*?~var pPattern = /^(?=.*\d)(?=.*[A-Za-z])(?=.*[!@$%^*?~])[\u4E00-\u9FA5A-Za-z0-9!@$%^*?~]{8,16}$/;console.log("=="+pPattern.test("11111~1?1a"));...

原创 检测二维数组内元素是否全相同

//检测二维数组内元素是否全相同function isAllEqual(array) {if (array.length > 0) {return !array.some(function (value, index) {if(index > 0){return value[0] !== array[index-1][0] || value[1] !== array[index-1][1];}});} else {return true;}}...

原创 微信小程序标签集合

微信小程序一些常用标签与html的对应关系html 小程序 <div></div> <view></view> <h1></h1>...<h6></h6><p></p><span></span> <view></view> <i class="icon"> <icon></

原创 flex布局思路

1.在一行水平垂直居中，不管子元素有多少，都在同一行显示，百分比也会被压缩。.aa{ display: flex; align-items: center; justify-content: center;}<ul class="aa"> <li></li> <li></li>...

原创 Vue this-$event事件

原创 js 百度地图自定义弹出信息窗口

效果图主要代码varhtml="<divclass='infoBoxContent'><divclass='title'>详情</div><divclass='infoBox-content'>"+"<divclass='line'><divstyle='float:left;'>&l...

原创 mp4视频 视频测试地址（在线MP4文件）

最近在做播放器调试，奈何没有现成的视频资源，找了一圈 分享一下，预防下次使用。驯龙高手 http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4《紧急救援》http://vfx.mtime.cn/Video/2019/03/21/mp4/190321153853126488.mp4玩具总动员htt...

原创 Echarts柱状图-Y轴分上下两行显示文字(避免文字遮挡)

// 创建图表配置数据this.options = { title: { left: 'center', text: this.title, }, tooltip:{ trigger:"axis" }, legend:{ data:[], y:'bottom' }...

原创 echarts柱状图的数据差距过大,显示太难看，如何解决

如图所示,在echarts图表展示时，会遇到数据量差距过大的情况，出现这种情况后，过小的数据不仅会影响美观性，往往还会影响交互（比如，点击事件等）option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }...

原创 百度地图js报错Uncaught TypeError: b.ga(...).nb is not a function

在百度 js API开发过程中，需要创建多点，并分贝给每个店添加事件监听，弹出信息框，但是，以下代码只能往地图中添加标注，却无法弹框。var point = {lng : 116.404 , lat : 39.915};var marker = new BMap.Marker(point,{icon:myIcon}); // 创建标注bmap.addOverlay(marker); // ...

原创 onClick 单引号+双引号：传参的转义问题

示例：var data="111";1.外部双引号：var html="<div onclick=\"showData(' " + data + " ')\">AAA</div>";2.外部单引号：var html='<div onclick="showData(\' ' + data +' \')">AAA</div>';注...

原创 Vue 默认选中 Layui select

方法一：<select class="form-control" name="method" data-itemid="{{ $index }}"> <template v-for="option in methodOptions"> <option :value="option" v-if="option == api.method"...

原创 解决父元素display:flex布局下的子元素宽度无效问题

因为设置了display: flex; 导致block布局变成了flex布局， 所以在子元素宽度没有被撑破的情况下，子元素宽度是有效的，但是当子元素内容过多，此时宽度会比实际宽度小，所以如果想要在已经设置了flex布局的基础上，再进行子元素宽度的设置，可以应用下面的样式：（在该子元素上设置）width: 120px;flex-shrink: 0;...

转载 为什么要前后端分离？有什么优缺点？

一、前戏前后端分离已成为互联网项目开发的业界标准使用方式，通过nginx+tomcat的方式（也可以中间加一个nodejs）有效的进行解耦，并且前后端分离会为以后的大型分布式架构、弹性计算架构、微服务架构、多端化服务（多种客户端，例如：浏览器，车载终端，安卓，IOS等等）打下坚实的基础。这个步骤是系统架构从猿进化成人的必经之路。核心思想是前端html页面通过ajax调用后端的re...

原创 关于js/vue小数点失精算法修正

今天用vue做小数点转换百分比的时候遇到：0.55*100 =55.00000000000001，起初以为是vue计算方式有问题，后来想到js有小数点失精的问题，结果测试了一下果然是这个问题：js失精算法console.log(0.1+0.2); //0.30000000000000004console.log(0.07*100); // 7.000000000000001...

原创 Layui表单select 获取option的自定义属性

在Layui里面给了特定几个自定义属性title<select name="aa" lay-filter="selectClassify"> <option value="">请选择分类</option> <option v-for="x in classifyList":value="x.id" :title="x.name" :...

原创 解决 Layui + Vue 动态渲染数据在 IE下 form.render() 无效 问题

前阵时间写了一遍关于 "layui+vue实现select动态加载后台数据" 的文章，用setTimeout +layui.form.render() 的方式来局部刷新的方式重新渲染页面，代码如下var new Vue({ el:"#app", data:{ items:null }, mounted:function () { this....

原创 Input 输入框限制只能输入数字或者带有两位小数的数字

限制只能保留两位小数点<input type="text" onkeyup="clearNoNum(this)"/>元clearNoNum:function(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除“数字”和“.”以外的字符 obj.value = obj.value...

原创 jquery+ajax分页， 判断总共多少页

var rowSize;//总数据条目数var pageSize = 10;//每页条数，默认为10条var currentPageIndex = 1;//当前的页，默认为第一页var pageNum = 1;//总共需要展示的页数$.ajax({ url: "url", type: "Post", dataType: "json", success: ...

原创 基于layer的图片弹出展示,默认原大小展示。图片太大则等比例缩小

/*** * html:<img src="img/1.jpg" onclick="showimg('img/1.jpg');"> * 图片弹出展示,默认原大小展示。图片大于浏览器时下窗口可视区域时，进行等比例缩小。 * src 图片路径。必须项 * imgHeight 图片显示高度，默认原大小展示。图片大于浏览器时下窗口可视区域时，进行等比例缩小。 * imgW...

原创 360浏览器兼容模式css错乱问题

解决360浏览器兼容模式css错乱问题有些时候在本地写好代码，不管是直接打开网页flie://,还是localhost:网页都没有问题，但是放到服务器上面，打开360浏览器后选择兼容模式，发现css错乱，而在本地没有任何问题。 下面给出两种解决方法：第一种：在head标签中添加一行代码：强制执行极速模式<meta name="renderer" content="w...

原创 如何刷新页面不保留上次input所选或所填的值？

比如一些输入数量或日期的input框，还有就是一些单选框和一些复选框，第二次进入页面，该input输入框都会显示一个上几次所选或所填的值，但是有时候我们需要刷新的时候进行清空还原默认的操作，我们可以这样：<input name="demo" value="" autocomplete="off"/>重点就是这个属性：autocomplete="off"...

原创 前端开发到底要不要用cdn ？

为什么要用CDN?浏览器从服务器上下载CSS、js和图片等文件时都要和服务器连接，而大部分服务器的带宽有限，如果超过限制，网页就半天反应不过来。而CDN可以通过不同的域名来加载文件，从而使下载文件的并发连接数大大增加。 jquery一类的库文件被广泛使用，如果访问你网站的用户的浏览器之前在访问别的网站时通过和你相同的CDN已经加载了jquery，由于该文件已经被缓存了，就不用重新下载了。 ...

原创 纯前端解码、播放、录音、编码 AMR 音频，无须服务器支持

纯前端解码、播放、录音、编码 AMR 音频，无须服务器支持，基于amr.js 和 RecorderJs。特性方便的 API 实现解码、播放、录音、编码 AMR 文件。 支持 url 和 blob （即&lt;input type="file"&gt;）方式获取 AMR。 支持将浏览器 &lt;audio&gt; 所支持的音频格式（例如 MP3 或 OGG 音频）转换成 AMR 音频。...

原创 前端开发是否需要必备一门后台语言？

职业的特殊性决定了我们需要跟后端工作者频繁的沟通。如果只顾页面实现，不考虑后台，写出来的页面也有一部分是废弃代码，在后台进行数据交互的时候用不了。还有一方面就是从招聘信息可以得知，现在几乎所有公司前端开发岗位都明确要求会后台语言，在实际工作中可能也要做客户端和服务器端之间的数据交互等。所以答案是 需要1.更有利于巩固前端知识，对网站有系统整体的认识2.更有利于未来的职业发展与服务...

原创 解决 UEditor 富文本编辑器 图片无法左右对齐问题

官网下载地址http://ueditor.baidu.com/website/download.html项目一直在用ueditor富文本编辑器，一直是对编辑器的图片、音频、视频的及地图进行配置，使编辑器正常使用，没有认真使用过编辑器就行文章编辑，今天编辑部突然说编辑器有问题，发现 图片选择左对齐或右对齐，保存以后并没有左右对齐，仍是居中状态， 查看源码以后发现是配置问题。解决办法：...

原创 layui+vue实现select动态加载后台数据

vue + layui 修改 获取到值加载不出来 -- 渲染问题 layui动态渲染之后，需要 layui.form.render(); 重新渲染一次数据//页面代码&lt;select name="Classification" lay-verify="Classification" class="selector"&gt; &lt;option value=""&gt;

转载 前端人员必看的CSS命名规范

作为前端的设计人员，对于CSS的接触，就像吃饭一样。所以CSS命名规范 命名是 前端人员必看的。文章整理了Web前端开发中的各种CSS规范，包括文件规范、注释规范、命名规范、书写规范、测试规范等。一、文件规范1、文件均归档至约定的目录中。具体要求通过豆瓣的CSS规范进行讲解：所有的CSS分为两大类：通用类和业务类。通用的CSS文件，放在如下目录中：基本样式库 /css/core 通用...

原创 前端实现百分比进度条

随着html5的普及，各种css3动画及js特效在网页中也是层出不穷，PC端加载数据的速度还是比较快的，但是对于移动端设备而言则相对要慢不少，如果图片或者脚本没有加载完，用户在操作中就可能发生各种问题，因此我们需要对数据加载进行侦测，以更加人性化的方法将网页程序内容展现给用户，实现更佳的用户体验。1.定时器实现进度条优点:解决大部分加载进度问题缺点:一旦有了缓存，定时器加载就变得鸡肋了...

原创 2019前端与移动开发各阶段知识点

原创 2019前端与移动开发学习路线图

原创 纯前端实现上传图片到本地或服务器，并根据时间创建文件夹，无需后台

1.我们平时接触到的接口都是后台需要你给他传递几个参数，你就把参数对应的值 给他们就行了$.ajax({ type: "get", url: URl, dataType: "json", data:{ }, success: function (d) {2.当你给后台传图片时，你传的是一个文件 而不再是普通的string类型的值。而...

原创 解决layui动态加载复选框无法选中

问题描述1.最近用layui做后台界面，遇到layui跟ajax数据动态加载的checkbox，偶尔不能正常勾选，取消2.有分页时，最后一页数据过少会导致其他页下方数据无法选中3.页面没加载完或暴力测试时也会不能选中利用layui更新渲染方法和网上的一些方法去解决后极大的减少了无法选中的情况，但是暴力测试时偶尔还会出现，实在不知道什么原因，所以就用了一个折中的方法——自己写一个复选...

原创 IIS下部署php项目

最近做一个项目，用到了图片上传和富文本编辑器，后台人员在忙其他项目，所以图片上传和富文本只能前端来实现了，做的时候也没用多想，用到了php的move_uploaded_file来实现图片上传，富文本用的是ueditor的php版本，可最好往服务器部署项目的时候发现后台用的是iis，项目运行中php文件直接被下载并不被运行，因为没有php环境，所以需要部署php环境。尝试iis下部署php环境...

原创 verify.js纯前端验证码插件

这是一款极简洁的表单校验插件，属于半封装模式，只需引入插件，即可任意编写业务逻辑代码，简单方便易修改。首先引入js，需提前引入jquery，然后引入verift即可使用&lt;script src="js/verify.js"&gt;&lt;/script&gt;普通验证码 &lt;h3&gt;普通验证码&lt;/h3&gt;&lt;div id="demo1"&

原创 前端js实现登录时右滑验证

前端js实现登录时右滑验证实现的效果：滑块验证部分代码实现的效果：本实例基于 网上verify.js插件，根据自己项目需求修改。大家下载verify.js后直接粘贴代码到对应的文件，便可直接运行。滑块验证部分代码// html部分代码 &lt;div id="demo"&gt;&lt;/div&gt;// css部分代码 /*常规验证码*/.verify-code { fo...