自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(37)
  • 收藏
  • 关注

原创 element ui选择框滚动加载下拉项

【代码】element ui选择框滚动加载下拉项。

2023-09-01 15:17:47 317

原创 CSS渐变

css渐变色

2023-01-19 09:55:56 153

原创 element 日期组件限制可选日期为过去的某个月 并且范围为这个月内的某一个时间段

elementUI 日期组件限制可选日期为过去的某个月,并且范围是这个月内的某一个时间段

2022-07-04 18:09:13 391

原创 vue+element PC系统自适应

这里需要借助到几个插件1.lib-flexiblenpm install lib-flexible --save安装完后再main.js文件中直接引入即可import "lib-flexible"注意,这个插件安装后需要在依赖中改变屏幕宽度,因为这个插件是为移动端设计的,最大宽度是540px,需要在/node_modules/lib-flexible/flexible.js这个路径下,将下图红框处修改成width即可(源代码这个地方是540)2.px2rem-loader 或者 postc

2022-05-23 23:25:31 1633 5

原创 input 类型为密码时 如何防止输入框自动填充

项目中需要用户输入一些隐秘信息,使用input的密码类型后发现总是会自动填充浏览器保存的账户信息,所以需要对此做处理,查了一下后说input的autocomplete属性设置为off可以,但是经测试发现不行,又有说还需要设置name属性,发现还是不行,最后想到一种障眼法,就是写两个一样的输入框,把其中一个隐藏掉,最好再设置一样的name值,这样浏览器就不知道要填充哪个了,从而达到防止账号自动填充的效果。如果有更好的办法欢迎留言。。。...

2021-08-26 17:26:31 659 2

原创 iframe解决跨域

在父页面中写入iframe标签,其中src值为需要跨域访问的页面地址<iframe ref="iframe" src="http://xxx/index.html" name="iframeDemo" width="100px" height="0px" frameborder="0" scrolling="no" style="opacity:0;" ></iframe>在父页面的方法中写入document.querySelector('iframe').contentWindo

2021-07-13 10:47:22 3240

原创 js字符串中换行符不起作用如何解决

有时候需要在字符串中使文字换行,但是换行符 \n 不起作用,这时候在他的HTML元素上,给他的css设置 white-space:pre-line; 这样在字符串中再加入换行符\n就可以实现字符串换行啦

2021-07-13 10:27:32 7175 2

原创 解决KindEditor无法安装flash插件实现图片批量上传

由于现在无法下载使用flash插件,导致KindEditor有的功能丧失,无法使用,本文主要解决图片无法批量上传的问题。由于公司项目是混编项目,比较老旧且业务复杂,使用KindEditor的地方较多,全部整改换插件工作量较大,短期无法满足业务,顾考虑换一种思路实现,即使用jQuery的图片批量上传插件来替换KindEditor中使用flash的部分,从而实现图片批量上传。KindEditor中实现图片皮来那个还是那个传的代码主要在multiimage.js文件中,直接下载的KindEditor文件夹没有

2021-07-09 10:50:59 3453 23

原创 vue-pdf 无法线上预览 路径404

1.使用vue-pdf时本地可以正常预览但是打包发布测试后报worker.js404此时需要修改依赖vue-pdf/

2021-04-09 11:47:55 3144

原创 vue+element UI的 table组件实现日历

有现成的日历插件但是不符合需求,所以项目中使用vue+element 的表格组件自己实现一个日历组件核心js部分:此部分为计算的当月的日期且包含是否可选,是否节假日等等可操作的标记,这部分基本是实现日历的核心部分 _getRegionData(startDateOfMonth, endDateOfMonth, startDate, endDate) { const region = endDateOfMonth.diff(moment(startDateOfMont

2021-03-05 18:17:15 2755

原创 vue v-on绑定多个事件

在vue框架里,我们使用v-on指令或者@(v-on的简写)符号来绑定事件,有时候一个标签上需要绑定多个事件,可以一个一个绑,但看起来很多,实际上v-on可以一次绑定多个不同事件,例如:<input type="text" v-on="{ input:onInput,focus:onFocus,blur:onBlur}">//可以正常执行不同方法 <div v-on="{ mousedown:onInput,mouseup:onFocus,mouseenter:onBlur}

2021-02-19 15:59:42 6172

原创 前后端分离项目,网络请求状态码返回0

最近一个项目碰到这种情况,项目为公众号网页,手机和微信开发者工具都可以正常访问后端接口,但在电脑微信端无法正常请求,http状态码返回0,由于前端请求将token封装进了header头中,故网络会先发送一次option请求,后端接收后让请求通过后才会发送正常的post或get请求,故而后端检查接受的第一次option请求,发现拦截了,...

2021-01-06 15:05:46 2475

原创 element按钮失效

项目中用了element框架,按钮一直好好的,但有一天突然按钮失效,查找一圈没找到原因,最后发现是黄色框里的样式值给的太小了,调大之后按钮可以正常使用

2020-07-09 14:56:20 838

原创 如何取消element表头的全选框

如果项目中使用了element表格,并且表格有多选功能,但是表格里的数据又有互斥选项,这时候就需要去掉表头的全部选择的复选框,但是在element官方文档里没有找到可以取消的方法,故而选择从样式下手,可以在控制台中找到表头全部选中复选框的样式,手动给它设置为不显示,具体代码如下:<style lang='scss'> .el-table__header-wrapper{ .el-checkbox__inner{ display: none; } }<

2020-07-08 14:14:16 3005 1

原创 vue+element实现动态换肤功能

有时候一个项目的主题并不能满足所有人的审美,这时候换肤功能就很友好,本项目基于vue+element实现后台管理项目的换肤功能1.创建换肤组件<template> <el-color-picker class="theme-picker" popper-class="theme-picker-dropdown" v-model="theme" :predefine="predefineColors" ></el-color-pi

2020-07-08 13:40:11 2932 4

原创 常用的正则表达式

1.正整数:/^[0-9]*[1-9][0-9]*$/2.大于等于0且可以保留两位小数:/^([1-9]\d*|0)(\.\d{1,2})?$/3.两位小数的校验:/^\d+(\.\d{0,2})?$/

2020-07-08 09:53:06 808 1

原创 vue 项目 element表单校验定位到未录入的第一个必录项

有时候一个页面过长,上面的必录表达没填,底下保存时不能正常用户会懵逼不知道啥情况,弹框提示的话还得不停的点击弹框而且若未填项比较多不停出现弹框也比较烦,这时候如果直接定位到未填项用户很容易明白保存失败原因且不用用户自己一个个找具体的未填项,以下代码便可实现具体表单未填项在校验时直接定位//获取当前必录的校验词并弹框提示输入具体必录项if(document.getElementsByClassName('el-form-item__error').length>0){ .

2020-05-14 22:59:54 2628 4

原创 封装axios

我们在使用axios 时每个页面都去单独使用会导致许多代码的重复,这时候就需要我们对axios根据项目需要进行二次封装,这样我们在使用时只需要在每个页面去调用接口就可以了。在src目录下新建文件夹axios,在文件夹里新建http.js文件和api.js文件在http.js页面里我们需要对axios进行封装,代码如下import axios from 'axios'import { Mes...

2019-11-27 10:00:56 99

原创 axios

一、axios是什么?1、axios是一个基于promise的HTTP库2、可以用于浏览器和node.js二、axios的作用什么?axios的作用是:主要是用于向后台发起请求的,还有在请求中做更多是可控功能。三、axios的特性1、支持promise API2、拦截请求和响应3、转化请求数据和响应数据4、取消请求5、自动转换json数据6、客户端支持防御XSRF四、兼容性...

2019-11-20 09:28:43 511

原创 使用vscode创建vue新项目失败,报错无法加载文件,如何解决?

当使用VScode创建vue新项目时报错,提示无法加载文件解决方法:1、以管理员身份运行PowerShell2、执行:get-ExecutionPolicy,若回复显示Restrict则表示禁止状态3、再次支执行:set-ExecutionPolicy RemoteSigned,回复Y(若被询问是否更改执行策略,回复Y)...

2019-11-19 10:42:45 2996 3

原创 响应式布局

一、什么叫响应式布局(作用)响应式布局可以让一个网站兼容不同分辨率的设备,并且可以给用户带来更好地视觉体验二、响应式布局的优缺点优点:解决了设备之间的差异化展示缺点:①兼容性代码多,工作量大,加载速度受影响②对原有网站布局会产生影响,用户判断未必精确三、设计原则①移动优先在设计的初期就要考虑到页面在多终端的展示②渐进增强充分发挥硬件设备的最大功能四、响应式布局实现的方法①c...

2019-09-21 21:56:14 354

原创 Vue 生命周期

Vue的生命周期是什么?Vue的生命周期是Vue实例从创建前创建后到更新前后再到销毁前后,总的来说分为八个步骤:创建前、后,载入前、后,更新前、后,销毁前、后。下面我们逐一来看每个步骤:beforeCreate:在实例初始化之后,数据观测(data observer)和event/watcher事件配置之前被调用;created:在实例创建完成后立即被调用,在这一步,实例已完成以下的配置...

2019-09-18 09:57:51 145

原创 Vue项目启动报错This is probably not a problem with npm. There is likely additional logging output above.解决

最近在整理项目,启动项目时发生报错解决方法很简单,重新 cnpm install 或者 npm install, 然后再cnpm run dev就好了

2019-09-06 10:59:21 3222

原创 JQuery中append()、prepent()、before()、和after()之间的区别

把append()和prepnt()放一起理解,before()和after()放一起理解,两组分别都是给元素添加新元素的,我们以实例来说明它们之间的区别append()和prepnt()append()<!DOCTYPE html><html><head><script src="/jquery/jquery-1.11.1.min.js"&g...

2019-09-03 15:36:45 700 2

原创 原生JS简单实现图片无缝滚动

图片无缝滚动的轮播主要利用滚动轴–x来实现,首先是HTML部分的实现<div id="d1"> <div id="d2"> <div id="d3"> <img src="./0118练习/img/111.jpg" alt=""/> <img src="./0118练习/...

2019-08-19 13:47:33 235

原创 原生JS实现图片轮播--淡入淡出

本篇博客所实现的图片轮播是较为简单的一种轮播,轮播效果为固定的位置不同图片的切换,所以首先需要对页面进行简单的布置HTML部分<div class="b"> <div class="btn"> <span class="btn_left"><</span> <span class="btn_ri...

2019-08-19 13:28:49 794

转载 HTML5+CSS3选择器

一、HTML5的认识HTML5相较于HTML4进行了升级,比HTML4语义化更明确,新增了一些标签,同时也废除了一些元素旧的标签。1.HTML5新增的语义化结构元素header表示一个页面中一个内容区块或整个页面的标题即页面顶部的内容。footer表示整个页面或页面中一个内容区块的脚注即页面底部的内容。section表示页面中的一个内容区块,可与h1、h2等元素结合使用,表示文...

2019-07-01 21:57:31 360

原创 如何给背景图片加颜色遮罩

方法一:通过定位叠加(注意层级关系)<style> .block { position: relative; margin: 50px auto; width: 700px; height: 450px; } .block > i...

2019-07-01 21:56:12 3376

原创 JS 数组集合

数组集合声明方式:1.var name=new Array(num);//定义名为name,包含num个元素的数组 name[0]=元素1;//每次为元素赋值 name[1]=元素2;2.var name=new Array(); name[0]=元素1;//每次为元素赋值 name[]=元素2;3.var name=new Array(元素1,元素2,...) ...

2019-01-17 23:14:50 1866

原创 JS闭包、函数递归和冒泡排序

闭包全局变量:在整个JS的作用范围局部变量:作用范围只是在当前的作用域闭包:闭包就是能够读取其他函数内部变量的函数,函数没有被释放,整条作用域链上的局部变量都将得到保留。            本质上,闭包就是将函数内部和外部连接的桥梁。            简单来说,闭包可以用来调用局部函数内部的值。操作时只需要使用return返回变量。闭包的特点闭包的值会存在内存...

2019-01-17 22:44:16 319

原创 JS初步学习2之DOM元素

JS可以写在HTML内部,也可以写在JavaScript里面采用外联的方式。写在HTML里面的JS可以写在head也可以写在body里。逻辑结构1.if elseif(){}if(){} else{} if(){} else if(){} else{}2.swith选择结构swith(){ case:break;...

2018-12-26 17:46:45 119

原创 JS初步学习

JavaScript是一种高级编程语言,通过解释执行,是一门动态类型,面向对象(基于原型)的直译语言。1、一个完整的 JavaScript 实现是由以下 3 个不同部分组成的:核心(ECMAscript):描述该语言的语法和基本对象;文档对象模型(Document Object Model,简称DOM):描述处理网页内容的方法和接口;浏览器对象模型(Browser Object...

2018-12-19 22:47:24 294

原创 CSS3媒体查询+手机自适应

 媒体查询媒体查询是可以让网页适用于不同大小屏幕的,写媒体查询时要注意:主样式在前,媒体查询样式在后。 媒体查询的条件写法,可以从小到大,也可以从大到小,也可以区间取值。媒体查询的写法:@ media all/screen and (最小值/最大值/区间值),all/screen表示所有屏幕尺寸,包括投影仪、打印机、手机、电脑等。媒体查询的引入方式有两种:内嵌式和外联式。内...

2018-12-15 18:14:57 1900

原创 CSS3动画

CSS3动画CSS3动画可以分为过渡动画  变形动画(平移,放大,旋转) 和自定义动画(帧动画)。变形动画一般和过渡动画或者自定义动画搭配使用。过渡动画过渡动画用元素transition来表示,它里面的属性有transition-delay:;表示动画延迟,transition-duration:;表示动画持续的时间transition-property:;表示动画的属...

2018-12-06 13:37:51 184

原创 网页制作之HTML+CSS布局

CSS网页布局:可以分为三种:1.固定布局  2.流动布局 (是百分百布局) 3.弹性布局(可用于移动APP开发)元素基本样式:1.行内样式:直接写在&lt;body&gt;部分的标签里面&lt;body&gt; &lt;span&gt;&lt;a href="#" style="color: red"&gt;每满千减百&lt;/a&gt;&l

2018-11-21 20:30:52 11970 2

原创 HTML+CSS布局

一、网页的布局1.固定布局        固定网页布局指网站内容被一个固定宽度的容器包裹起来,容器内的区块都有固定的百分比或者像素宽度值。最重要一点是容器是不能移动。不管屏幕的分辨率如何变化,访客看到的都是固定宽度的内容。2.流动布局(百分比布局)         流动网页布局,也称流体网页布局。它的实现方法是大多数组件(包括主容器)都设成百分比宽度,并且根据用户的屏幕分辨率自适应...

2018-11-19 19:22:59 222

原创 html标签的盒子模型

在HTML 的标签中&lt;div&gt;&lt;/div&gt;标签被称作盒子模型,也就是说我们把整个网页当做是一个大盒子,在网页里我们放许多小盒子&lt;div&gt;&lt;/div&gt;标签,我们可以用&lt;div&gt;&lt;/div&gt;来搭建整个网页的框架,可以设置&lt;div&gt;&lt;/div&gt;盒子的大小、边框、背景色等等,也可以在盒子里面填充

2018-11-14 21:51:00 4775

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除