前端
奋斗的蜗牛,奔跑吧
坚持不懈和疯狂的行动,总是肯定自己,处处大胆自信,敞开心扉,激发智慧,不断进取,永不放弃。你怎么能不成功?
展开
-
JSON数据过滤
【代码】JSON数据过滤。原创 2023-02-26 00:15:00 · 238 阅读 · 1 评论 -
获取File URL路径
获取File URL路径。原创 2022-10-08 22:30:00 · 949 阅读 · 0 评论 -
cas 无法使用iframe
cas html页面使用iframe将红框圈出来的进行关闭#关闭xframecas.httpWebRequest.header.xframe=false原创 2021-03-27 15:40:19 · 861 阅读 · 0 评论 -
jquery 清空某个节点下的元素
1.清空某个节点下的所有元素$("#test").empty()2.清空某个节点下的特定元素$("#table").find("td").remove();原创 2021-02-26 11:16:04 · 375 阅读 · 0 评论 -
layui confirm 取消事件
layer.confirm('确定要删除吗?', { icon:3, title:"提示", btn: ['确定', '取消'], submit:function(index){ layer.close(index); console.log("提交...原创 2021-02-20 13:53:56 · 1915 阅读 · 0 评论 -
layui 隐藏表格中的某一列
{field: 'address', title: '地址', hide: true}原创 2021-02-20 10:49:18 · 493 阅读 · 1 评论 -
layui的treeTable插件表格树表格行单击点击事件绑定不生效
layui版本:v2.5.6treeTable版本:2.x按照官方文档,dom标签如下:<table id="zzglTab" lay-filter="zzgl"></table>js渲染和绑定事件: layui.config({ base: '${basePath}' }).extend({ treeTable: 'static/treeTable/treeTable' }).use(['treeTabl转载 2021-02-19 09:41:40 · 2614 阅读 · 0 评论 -
Layui实现TreeTable(树形数据表格)
转载https://www.cnblogs.com/Chen-Ru/p/14176723.html转载 2021-02-18 19:59:37 · 1952 阅读 · 0 评论 -
layUI 表格中1:0转换成男女 if else数字转对应中文显示
layUI 表格中if else数字转对应中文显示在将数据放入表格中进行列表展示时不可避免的需要进行类似于字典码转换的工作,比如说数据库中user表中的性别属性,表中为了读取操作的便利一般用0,1来代替女,男这两个字符,但是数据到打前台后必须要进行转换显示(当然也可以在后台转换~),如果不转换就如下图所示:转换代码很简单,只需要在layUI的表格代码中添加上if语句判断即可,代码如下:var oaUserHolidyTable = tablePlus.render('oaUserHolidy-转载 2021-02-09 21:21:46 · 1191 阅读 · 0 评论 -
css 单行超出出现省略号
overflow: hidden;text-overflow:ellipsis;white-space: nowrap;原创 2020-11-28 18:27:54 · 94 阅读 · 0 评论 -
Vue中动态渲染输入框并v-model绑定后无法输入
<el-input v-model="data[item.prop]"></el-input>示例: data={size:''} config=[{label:'ceshi',prop:'size'}]item 为循环后的对象for (var i = 0; i < this.config.length; i++) { this.data[this.config[i]['prop']] =''}//v-model 绑定后无法输入for.原创 2020-09-27 13:13:08 · 4387 阅读 · 1 评论 -
JavaScript获取法定节假日
API:http://opendata.baidu.com/api.php?query=2020年&resource_id=6018&format=json返回参数:{ "data":{ "status":"0", "t":"", "set_cache_time":"", "data":[ { "StdStg":6018, .原创 2020-09-25 11:36:24 · 6997 阅读 · 3 评论 -
ts获取当前年份的所有周末
public getWeekendDate(): Array<string> { let date: Date = new Date() let year: number = date.getFullYear() let m: number, d: number, day: any, dayNum: any, result: Array<string> = [] for (m = 1; m <= 12; m++) { switch.原创 2020-09-25 11:33:14 · 906 阅读 · 0 评论 -
时间季度组件
<template> <el-form label-width="100" style="width: 18.75rem;"> <el-form-item label="季度"> <mark class="_mark" v-show="showSeason" @click.stop="showSeason = false"></mark> <el-input size="mini" placeholder="请选择日期" .原创 2020-09-23 14:58:51 · 649 阅读 · 0 评论 -
element -ui 时间组件 年月
<template> <div> <el-date-picker v-model="value" class="timePicker" type="month" placeholder="" format="yyyy-MM" value-format="yyyy-MM"> </el-date-picker> </div></template><script>.原创 2020-09-23 10:48:03 · 1649 阅读 · 1 评论 -
vue放大缩小div
<span @click="narrow()"> <svg class="fulls-iconfont" aria-hidden="true"> <use xlink:href="#bi-cancel-full-screen"></use> </svg> </span> <span @click="enlarge()"> <svg class="fulls..原创 2020-09-22 19:28:54 · 5106 阅读 · 1 评论 -
JavaScript 获取浏览器的宽高
var _width= document.documentElement.clientWidthvar _height= document.documentElement.clientHeight原创 2020-09-22 19:22:38 · 75 阅读 · 0 评论 -
vue读取json文件
1.编写json文件,data.json{ "success":true, "code":"200", "message":"success", "data":{ }, "errorCode":null, "detailErrorMsg":null, "errorMsg":null}2.js读取 var appData = require('./data.json'); console.log(appData).原创 2020-08-11 14:21:08 · 12948 阅读 · 0 评论 -
vue+html2Canvas 保存png
1.说明将HTML展示的页面保存为png文件2.安装npm install html2canvasnpm install jspdf3.主函数import html2Canvas from 'html2canvas'import JsPDF from 'jspdf'//title:下载的名称pdf(title) { var element:any =document.body setTimeout(() => { html2Canvas(element).原创 2020-08-10 18:42:54 · 316 阅读 · 0 评论 -
vue+html2Canvas 保存pdf文件
1.说明将HTML展示的页面保存为pdf文件2.安装npm install html2canvasnpm install jspdf3.主函数import html2Canvas from 'html2canvas'import JsPDF from 'jspdf'//title:下载的名称pdf(title) { var element:any =document.body setTimeout(() => { html2Canvas(element).原创 2020-08-10 18:38:51 · 979 阅读 · 1 评论 -
vue中缩放div,echart随之变化
1.vue<template> <div class="div-content"> <div style="width: 500px;height: 200px;border: 1px solid;" @dblclick="aaaa('aaaa')" id="aaaa"> <div id="aaaa1595560719032" style="width:100%;height:100%;"></div> <div c原创 2020-08-03 09:40:26 · 728 阅读 · 0 评论 -
html中加载echart图表
<!DOCTYPE html><html> <head> <meta charset='utf-8'> <title>ECharts</title> <script src='https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js'></script> </head> <body> <div clas.原创 2020-08-03 09:33:20 · 532 阅读 · 0 评论 -
判断鼠标是否在某个区域内
var divDom: any = document.getElementById('content') //所在的区域 var oEvent = ev || event var x = oEvent.clientX //当前鼠标的x轴 var y = oEvent.clientY //当前鼠标所在的y轴 var divLeft = divDom.offsetLeft var divTop = divDom.offsetTop var divLeft1 = d.原创 2020-08-03 09:14:56 · 1677 阅读 · 0 评论 -
js 拖动div
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> #div2 { width: 150px; height: 150px; position: absolute; background: #CCCCCC; } .box { border: 1px.转载 2020-08-03 09:07:43 · 169 阅读 · 0 评论 -
js中offsetWidth相关属性的解释
关于js中的offsetWidth、clientWidth、scrollWidth等一系列属性及其方法一直都傻傻分不清,这里就来总结一下这些方法的用法和含义。注意: 下面元素属性和元素方法都通过elem.属性或elem.方法的方式使用,window属性通过window.属性的方式使用,document属性则通过document调用。<script> /* ****** 元素视图属性 * offsetWidth 水平方向 width + 左右pad...转载 2020-08-01 21:49:11 · 1597 阅读 · 0 评论 -
vue+ts+element 表格添加下拉框和input选项
<el-table :data="tableData" class="tb-edit" :header-cell-style="{ background: '#b4d8df' }" style="width: 100%" height="600px" highlight-current-row @row-click="handleCurrentChange" > <el-table-.原创 2020-07-17 09:20:21 · 4434 阅读 · 0 评论 -
使用JS播放声音——SoundManager 2
<!DOCTYPE html><html><head> <meta charset=utf-8 /> <title>SoundDemo</title> <script type="text/javascript" src="script/soundmanager2-n转载 2019-01-30 16:48:22 · 2763 阅读 · 0 评论 -
格林威治时间转换
var myDate = new Date(); var hour=myDate.getHours(); var interTimes=35*60*60*1000; var interTimes=parseInt(interTimes); var date=new Date(Date.parse(myDate)-interTimes); /* 当前整点时...原创 2019-01-23 14:40:27 · 1801 阅读 · 0 评论 -
javascript把RGB指定颜色转换成十六进制颜色
function RGB2Color(r,g,b){ return '#' + byte2Hex(r) + byte2Hex(g) + byte2Hex(b);} function byte2Hex(n){ var nybHexString = "0123456789ABCDEF"; return String(nybHexString.substr((n &g...转载 2019-01-28 13:49:25 · 593 阅读 · 0 评论 -
前端调试
分类输出不同类别信息的输出console.log('文字信息');console.info('提示信息');console.warn('警告信息');console.error('错误信息');转载 2019-01-27 17:36:42 · 114 阅读 · 0 评论 -
JavaScript调试技巧之console.log()详解
JavaScript调试技巧之console.log()详解JavaScript调试技巧之console.log()详解对于JavaScript程序的调试,相比于alert(),使用console.log()是一种更好的方式,原因在于:alert()函数会阻断JavaScript程序的执行,从而造成副作用;alert弹出框需要点击确认比较麻烦,而console.log()仅在控制台中打印...转载 2019-01-27 17:34:05 · 4180 阅读 · 0 评论 -
颜色选项卡
<!-- jQuery --> <script src="jquery.min.js"></script> <!-- Bootstrap 3 --> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap原创 2019-01-27 15:55:07 · 496 阅读 · 0 评论 -
【Java】使用iText生成PDF文件
【Java】使用iText生成PDF文件 iText是著名的开放源码的站点sourceforge一个项目,是用于生成PDF文档的一个java类库。通过iText不仅可以生成PDF或rtf的文档,而且可以将XML、Html文件转化为PDF文件。 项目要使用iText,必须引入jar包。才能使用,maven依赖如下:1 <dependency>2 <gro...转载 2019-01-17 20:18:23 · 10719 阅读 · 0 评论 -
ext store.load异步问题
store.load({callback : function(){store.getCount();}});//这样的话每次调用load的时候就会去调store.getCount()方法。立即就会得到值。this.userStore.removeAll();userStore.load({callback : function(r, options, success...转载 2019-01-17 20:15:57 · 1115 阅读 · 0 评论 -
如何优雅地处理前端异常?
前端一直是距离用户最近的一层,随着产品的日益完善,我们会更加注重用户体验,而前端异常却如鲠在喉,甚是烦人。一、为什么要处理异常?异常是不可控的,会影响最终的呈现结果,但是我们有充分的理由去做这样的事情。1.增强用户体验; 2.远程定位问题; 3.未雨绸缪,及早发现问题; 4.无法复线问题,尤其是移动端,机型,系统都是问题; 5.完善的前端方案,前端监控系统;对于 JS 而言,...转载 2019-01-31 11:06:24 · 189 阅读 · 0 评论 -
Extjs上传导入数据前端(二)
创建Extjs表格省略...... var fileImport; var uploadForm = new Ext.FormPanel({ id: 'uploadForm', width: 320, frame: true, fileUpload: true, autoHeight: true, ...原创 2019-02-18 13:10:24 · 295 阅读 · 0 评论 -
介绍Thymeleaf
Thymeleaf是一个Java库。它是一个XML / XHTML / HTML5模板引擎,能够将一组转换应用于模板文件,以显示应用程序生成的数据和/或文本。它更适合在Web应用程序中提供XHTML / HTML5,但它可以处理任何XML文件,无论是在Web中还是在独立应用程序中。Thymeleaf的主要目标是提供一种优雅且格式良好的创建模板的方法。为了实现这一点,它基于XML标签和属性,...转载 2019-02-25 09:40:35 · 225 阅读 · 0 评论 -
防止冒泡和捕获
防止冒泡和捕获w3c的方法是e.stopPropagation(),IE则是使用e.cancelBubble = truestopPropagation也是事件对象(Event)的一个方法,作用是阻止目标元素的冒泡事件,但是会不阻止默认行为。什么是冒泡事件?如在一个按钮是绑定一个”click”事件,那么”click”事件会依次在它的父级元素中被触发 。stopPropagation就是阻止...转载 2019-09-07 19:06:11 · 623 阅读 · 0 评论 -
Vue父组件向子组件传值,且要监听该值的变化
vue父组件向子组件传值时,如果值会根据父组件的相关操作而变化,则需要在子组件里用watch对其进行监听1、父组件<template> <div> <air-station :value="value"></air-station> </div></template>import AirSta...转载 2019-09-07 18:12:32 · 1022 阅读 · 0 评论 -
父组件获取子组件的方法
1.父组件HomePage<template> <div> <button @click="clicks">点击获取子元素的方法</button> <!-- 子组件 --> <aaa ref="headerChild"/> </div></template>...原创 2019-09-07 19:02:58 · 866 阅读 · 0 评论