
前端
yytoo2
专业打杂
展开
-
chrome console调试(寻找指定src的img)
调试的时候要找到已知src的img标签var images=document.getElementsByTagName_r("img"); //获得所有tagname为img的标签for(var i = 0; i if(images[i].getAttribute("src") == "XXX/XXX.jpg") //获得img标签的src属性值,并与已知的那个src原创 2017-06-27 09:45:11 · 1188 阅读 · 0 评论 -
sessionStorage存储json格式
sessionStorage可以使用string sessionStorage.setItem(string key, string value) 方法, 以key-value的格式存储数据.但是在存储json对象时需要注意,先用通过JSON.stringify()将对象转换为文本格式.读取时,则使用JSON.parse()将文本转换回对象....原创 2018-06-28 11:18:12 · 1010 阅读 · 0 评论 -
layui使用class绑定多个日期控件
js部分配置//layui配置layui.use(['form', 'layedit', 'laydate'], function(){ var form = layui.form, laydate = layui.laydate; //日期 $('.my_class_name').each(function(){ laydate.render({ elem: thi...原创 2018-07-20 18:29:54 · 5602 阅读 · 1 评论 -
layui+struts2上传文件
前端html部分:<button type="button" class="layui-btn" id="uploadMutil">上传pdf</button>前端js部分layui配置var upId=122;layui.use(['upload','form', 'layedit', 'laydate'], function(){ var uplo...原创 2018-08-09 09:56:12 · 2606 阅读 · 0 评论 -
前端vue+element/后端ssm+pageHelper实现列表页(带翻页)
一 前端部分 vue+element之前写jsp, 列表页翻页是通过向后端传递页码, 然后重新加载该页面实现的现在改为vue, 需要换一种思维方式, 通过axios传递页码到后端重新获取当前页的列表信息, 然后使用this.$set(target, key, value)修改table中加载的数据(如果只是用双向绑定的话, 数据改变了, 但是vue不会重新加载页面上的数据, 必须使用set...原创 2018-08-23 14:13:04 · 2165 阅读 · 1 评论 -
vue+element表单验证(多重object嵌套)
element的表单验证用的是async-validator, 官方说明文档地址:https://github.com/yiminghe/async-validator;element官网对表单验证只有简单的几个例子这里记录下双层嵌套object数据的表单验证:1. data中数据如下:data(){ return{ ruleForm:{ human...原创 2018-09-11 15:28:34 · 10378 阅读 · 1 评论 -
js中中括号和点的区别
在js中如果要获取某个Object中的内容, 可以用点(.)或者中括号([]). 但是这两者是有区别的.点后面加的是静态的标识符, 而中括号中同时也可以加动态的字符串. 如果需要动态的获取值可以用中括号:var obj={ say1:1, say2:2, say3:3 } for(let i=1; i<Obj...原创 2018-09-19 13:40:19 · 2189 阅读 · 0 评论 -
jsp中调用java静态常量
1. 在普通的jsp代码中嵌入java静态常量1.1 在页面开头引入该静态常量所在的类: <%@page import="com.XXX.XXXX"%>1.2 在HTML片段中使用该静态常量: <option value="<%=Code.TYPE_0%>">否</option> 2. 在struts2的s标签中调用java静态常量...原创 2018-11-06 11:12:04 · 2778 阅读 · 0 评论 -
js图片加载----图片名带百分号
有时候使用layui或者elementUI实现图片预览功能 或者页面加载图片的时候会发现个别图片无法显示原因可能是图片名中带百分号, 图片加载的时候, 相当于在地址栏中输入了带百分号的地址, 但没有encode, 这时候会无法识别解决方法: 拼接完整图片地址的时候, 单独对图片名encodeURIComponent()this.fileList[i].url=this.HOST+"/"...原创 2018-11-13 11:44:45 · 684 阅读 · 0 评论 -
elementUI校验注意事项(不定期更新)
1. 数字校验1.1 elementUI官方提供的数字校验: elementUI的数字校验和其他校验不同, 使用了Vue 自身提供的用于将绑定值转化为 number 类型的修饰符.步骤两步:1) el-form-item中填写prop2)v-model后面添加".number" (这一步比较特别)3) 在rules定义:{ type: 'number', message:...原创 2018-11-13 17:38:19 · 586 阅读 · 0 评论 -
elementUI中使用formatter对table中时间格式化
elementUI中的table提供了formatter这个属性来对传入的数据进行用户自定义的格式化table的写法如下: <el-table :data="list" border style="width: 100%" :header-cell-style="{color:'black',textAlign:'center'}"> <el-table-co...原创 2018-11-12 15:09:06 · 17534 阅读 · 1 评论 -
elementUI提交表单时焦点跳转至第一个校验不通过处
this.$refs[formName].validate((valid) => { if (valid) { } else { setTimeout(()=>{ var isError= document.getElementsByClassName("is-error"); is...原创 2018-11-28 14:15:37 · 2794 阅读 · 0 评论 -
js实现可下拉选择也可手动填写的input
body部分:<div style="width:70px"> <input type="text" name="loadingPort" autocomplete="off" class="layui-input autocomplete"> <div class="loadingPort ly-hide原创 2018-11-28 14:14:28 · 3370 阅读 · 0 评论 -
vue项目中package.json中的版本号
使用nodejs webpack vue-cli脚手架搭建的vue项目安装element vuex等均使用cnpm installnpm install moduleName # 安装模块到项目目录下 npm install -g moduleName # -g 的意思是将模块安装到全局,具体安装到磁盘哪个位置,要看 npm config prefix 的位置。 npm inst...原创 2018-11-28 14:33:03 · 8417 阅读 · 2 评论 -
layer更改皮肤
layUI的弹出层模块layer在使用时有一个skin属性skin不仅允许你传入layer内置的样式class名,还可以传入您自定义的class名。如果要改变弹出层的title样式或者背景之类的就可以使用该属性。使用方法如下:在layer.open中使用skin:layer.open({ type: 1, title: '变化详情', shadeClose: true, shade: 0...原创 2018-05-28 12:19:35 · 16097 阅读 · 1 评论 -
vue-lazyload简单配置
vue-lazyload是比较常用的vue图片懒加载插件。配置和使用比较简单。当仙居谣加载大量图片的时候可以使用该插件。简易版配置步骤:1. cnpm或者npm安装cnpm i vue-lazyload -S #安装至develop中npm install vue-lazyload --save-dev2. main.js中引入并配置参数比较常用的参数是图片加载错误(error)和预加载时...原创 2018-06-03 22:18:01 · 2375 阅读 · 0 评论 -
vue-devtools在build时出错
安装vue-devtools时,我最先开始是在https://github.com/vuejs/vue-devtools下载的最新版本(4.1.4)最开始nodejs版本是6,在cnpm install安装依赖时提示部分依赖可能由于node版本过低无法使用,所以我升级成了8,然后再开始cnpm run build进行编译但是在编译到91%的时候弹出error:我再xxxxx\vue-devtool...原创 2018-04-24 23:44:17 · 11312 阅读 · 1 评论 -
随机生成10个手机号(js实现)
function getMoblieNum(){var numArray = new Array("139","138","137","136","135","134","159","158","157","150","151","152","188","187","182","183","184","178","130","131","132","156","155","186","18原创 2017-06-27 09:45:58 · 9976 阅读 · 0 评论 -
jQuery事件对象的属性和方法
1.event.type:获取事件的类型,例如click事件等2.event.pageX 和 event.pageY:获取鼠标当前相对于页面的坐标,原点为页面的左上角,不随滑动条移动而变化3.event.which:对于键盘事件, 返回触发事件的键的数字编码. 对于鼠标事件, 返回鼠标按键号(1左,2中,3右).4.event.keyCode:对于keyup和keydown事件返回被按原创 2017-06-28 12:01:27 · 400 阅读 · 0 评论 -
部分css实现垂直居中和靠右的方法
一、垂直居中方法:1)使用padding使多个文本或input在div中居中显示(对div和文本高度有要求): 将div的高度设为各子元素中高度最高的一个h1,加入我们需要的div高度为h2,那么我们就需要填充padding-top和padding-bottom均为(h2-h1)/2,若选取的h1不是最高的元素高度则可能出现部分模块显示偏下 (若文字高度未原创 2017-06-28 12:02:07 · 9603 阅读 · 0 评论 -
jQuery中keydown和keyup的区别以及keypress的用法
在jQuery中keydown事件的触发时在键盘按下时,也就是文字输入之前,所以显示的是输入框之前输入的内容;但是keyup事件触发时文字已经输入完成所以显示的是当前输入的文字.感觉上就是keydown反应慢一拍,keyup和用户输入保持同步的效果.此外keypress与keydown较相似. keypress具有以下缺点:1.对中文输入法支持不好,无法响应中文输入2.无法响应原创 2017-06-28 12:02:54 · 1285 阅读 · 0 评论 -
onclick调用函数中的$(this)未指向当前节点——jquery
在写html时,对button绑定了onclick事件,如下:注意:此时的onclick中函数未传递任何参数在function中我们尝试获取input这个节点信息:function changeContent(){alert($(this).tagName;}在chrome中运行后我们发现返回的是undefined,也就是说获取到的不是input节点原创 2017-08-17 10:59:36 · 20539 阅读 · 6 评论 -
输入校验一(js实现用户名校验)
输入校验一般可以分为两种,一种是客户端校验,采用js在提交表单前进行校验反馈;另一种是在服务器端进行校验,下一节会记录struts2中的输入校验。要实js对表单内容进行校验,这里采用的方式,这种方式可以在from标签中设置onsubmit,通过return false或true来控制是否进行下一步提交动作。jsp页面中表单部分如下:用户名: js部原创 2017-11-30 17:37:10 · 4895 阅读 · 0 评论 -
获取屏幕翻转resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', 'orientationc
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', 这段是为了获取移动端屏幕是否翻转(手机重力感应等引起屏幕长宽变化之类的)'orientationchange' in window 这个是判断在window对象中是否有orientationchange属性,因为orientationch原创 2017-12-24 22:10:26 · 4196 阅读 · 1 评论 -
js中区分""和0
在js中if(""==0)的结果是true。有时候我们在处理""和0的时候是执行不同步骤的。这时候我们需要区分这两者。这时候可以使用js的String()函数转化为String再进行判断。此外:还有一些为true的情况:0 == false“” == falsenull == undefined同时,以上的0,false,"",null,undefined做非运算后都可以得到true下列情况中结果...原创 2018-02-08 15:20:59 · 2972 阅读 · 0 评论 -
vue-cli脚手架搭建vue——第一天
所有安装几乎都是用cnpm完成1. 下载并安装node.js,官网下载地址:https://nodejs.org/en/,选择适合的版本(建议稳定版,目前稳定版本是8.11.1)2. 配置淘宝NPM镜像,使用淘宝镜像可以使后面安装更加快速稳定。官网教程:http://npm.taobao.org/ 我使用的是cmd命令:打开dos窗后后,输入npm install -g...原创 2018-04-02 09:26:58 · 229 阅读 · 0 评论 -
vscode常用前端插件
1. EditorConfig for VS Code2. ESLint3. gitignore4. languageStylus5. Nunjucks6. One Dark Pro7. PostCSS Syntax8. Vetur9. View In Browser10. vscode-icons原创 2018-04-14 22:17:28 · 1137 阅读 · 0 评论 -
js将时间戳转标准日期
// 对Date的扩展,将 Date 转化为指定格式的String // 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符, // 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字) Date.prototype.Format = function (fmt) { //author: meiz...原创 2018-04-10 10:22:06 · 480 阅读 · 0 评论 -
webpack4版本的安装和使用
在跟随网上教程学习vue的时候,发现按教程的步骤运行webpack的时候会有报错。找了下资料,现将解决方法记录下来备忘1. 首先还是在项目目录下运行cnpm install -D webpack,采取根目录安装,如果要选择全局环境安装,把D改为g即可2. 如果此时运行webpack或者webpack -v 会得到以下报错: The CLI moved into a separate ...原创 2018-03-29 15:01:36 · 3581 阅读 · 0 评论 -
layui中select更改后生效
在layui中重新渲染表单这一步比较重要,部分表单元素需要重新渲染后才能生效,例如select建议在js中放入以下function: //重新渲染表单 function renderForm(){ layui.use('form', function(){ var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成...原创 2018-04-13 14:56:17 · 6841 阅读 · 1 评论 -
elementUI的table绑定数据更新
问题: <el-table>绑定数据不显示情况描述: elementUI中的<el-table>标签通过:data="myDataList"来绑定data中的list变量一般情况下, 在methods中, 使用 this.myDataList=res.data.dataFromServer 这类直接将从后端获取的数据赋值给myDataList,但是假如我们需要对...原创 2018-12-12 14:44:56 · 22043 阅读 · 0 评论