![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
心酱儿
一个逻辑思维略差的程序媛
展开
-
bootstrapTable根据动态因子生成动态多行表头
根据项目需要,前端需要实现根据用户选择的因子来生成动态多行表头,经测试发现,多行表头其实就是由多维数组实现,只要将自己的数据按照bootstrapTable数据格式拼接成所对应的数组就可以实现功能,本文为实现代码供大家参考:【注】前端html页面需要引入对应的库,如:bootstrap-table.js、bootstrap-table-zh-CN.js、bootstrap-table.css、...原创 2019-05-05 11:17:02 · 3602 阅读 · 1 评论 -
用js快速动态生成bootstrap table表格数据
1.html页面 <div class="tableArea "> <table class="table table-striped" id="table" data-height="600"> <!--在此处填充表格数据--> </table> </div>js方法<script type="text/javascript"> var $table翻译 2017-12-08 09:45:01 · 8414 阅读 · 2 评论 -
layui 附件上传、预览、删除、下载
layui在开发文档中提供了 附件上传的方法upload.render(),此篇文章在此模块基础方法上扩展补充了附件预览、删除、下载的实现方法。具体如下:layui 文件/图片上传layui 相册层一、html<div class="layui-form-item"> <div class="layui-inline"> <label class="layui-form-label"><span class="font-colo原创 2020-11-25 15:03:55 · 10837 阅读 · 6 评论 -
datetimepicker的用法和时间的绑定
本篇文章主要讲datetimepicker的用法,在使用的过程中也遇到过坑,之前一直使用的daterangepicker时间插件,但由于daterangepicker不支持年视图,周视图,所以最后根据业务需求改用datetimepicker,用两个时间控件来形成双视图的效果,在使用的过程中发现月视图似乎有bug,时间会往前推两个月,在限制时间选择范围上造成不便,最后决定不限制时间的选择时间,谁已经原创 2017-09-08 17:44:22 · 17981 阅读 · 2 评论 -
underscore.js 给表单批量赋值
在项目中经常会遇到增删改的功能,在编辑表单的时候由于表单文本数量较多一个一个赋值代码冗杂不说,也大大降低了时间效率,同事告诉一个快捷方法,特别好用,特此记录一下:首先这里需要先下载underscore.js插件,这是一款轻量级的js插件,有兴趣的同学可以了解一下: underscore.js官方文档地址 1.html <form id="EditForm" name="EditForm" met原创 2017-12-20 11:42:31 · 739 阅读 · 0 评论 -
CSS清除ios设备表单按钮自带样式问题
1 . ios中input框体颜色会变黑,设置高亮颜色为0,0,0,0input{-webkit-tap-highlight-color:rgab(0,0,0,0);}2 . 清除ios设备按钮自带样式button{-webkit-appearance:none;}3 . 清除表单元素手机端样式中checkbox元素显示不出样式-webkit-appearance:checkbox;原创 2016-12-12 14:43:51 · 1037 阅读 · 0 评论 -
移动手机开发meta注意问题
一:在移动开发的页面里中常常会出现以下这样的代码,这里总结一下这样写的意义和作用:1.该meta标签的作用是让当前viewport的宽度等于设备的宽度,同时不允许用户手动缩放,以防手机页面下方出现滚动条。 initial-scale:设置页面的初始缩放值,为一个数字,可以带小数; minimum-scale: 允许用户的最小缩放值,为一个数字,可以带小数; maximum-scale:允许用户原创 2016-12-12 14:19:03 · 294 阅读 · 0 评论 -
超链接实现返回上一页
在移动开发中,常常会有很多返回页,而且往往也只是需要返回打开当前页的前一页,有时候还要兼容ios和安卓系统,下面是我在开发过程中总结下来的几种有效方法:一:适应于安卓设备<!-- 直接返回当前页的前一页,数据全部更新,打开的数据为新页面--><a href="#" onclick="Javascript:history.back(-1);"></a><!-- 直接返回当前页的前一页,数据无更新,表原创 2016-12-12 11:23:35 · 2145 阅读 · 0 评论 -
web开发 兼容不同的屏幕分辨率和浏览器
在web开发的过程中经常会要求根据不同的屏幕大小来做兼容,尤其是webAPP的流行和各种响应式布局,兼容不同的屏幕分辨率更是前端开发者必会的技能。本篇主要介绍用CSS 的媒体查询来兼容不同的屏幕大小和用js 来兼容不同的浏览器(主要是IE、火狐、360、谷歌、UC、QQ、百度等)。一、CSS媒体查询使用 CSS3 的@media 查询,你可以针对不同的媒体类型定义不同的样式。它的语法结构是:...原创 2018-11-22 10:30:05 · 23798 阅读 · 0 评论 -
IE9兼容问题
本篇文章记录下我最近在兼容IE9所遇到的问题以及解决方法1、button中添加其他标签在IE9中会失效<button type='button'><input value='登录' name='submit'></button>//此写法在谷歌、360及火狐等常规浏览器中运行正常,但在IE9及以下版本,button中的input无法解析,在input中的事件无法执行,解决方式是将button标签改为其他标签,如span、div等;2、innerHtml方法IE9原创 2020-08-05 11:00:46 · 701 阅读 · 0 评论 -
D3.js绘制 颜色:RGB、HSL和插值 (V3版本)
颜色和插值计算机中的颜色,常用的标准有RGB和HSL。RGB:色彩模式是通过对红(Red)、绿(Green)、蓝(Blue)三个颜色通道相互叠加来得到额各式各样的颜色。三个通道的值得范围都是0~255,因此总共能表示16777216(255255255)种,即一千六百多万种颜色。几乎包括了人类所能识别的所有颜色,是应用最广泛的色彩模式。HSL:色彩模式是通过色相(Hue)、饱和度(Saturation)、明度(Lightness)三个通道的相互叠加来得到各种颜色的。其中,色相的范围为0°360°,饱和转载 2021-06-28 11:06:56 · 2808 阅读 · 0 评论 -
dtree.js 树结构点击父节点异步加载子节点数据
由于此次项目开发框架使用layui,里面的树结构自然想到了使用dtree,功能需求是选择省份下的企业,由于企业数据达到上万家,一次性将所有的数据加载出来会造成页面卡顿,由此想到先加载行政区划再根据点击事件获取...原创 2020-11-24 16:26:08 · 4177 阅读 · 0 评论 -
iframe 父子级取值
一、获取页面本身url ?后的参数/* name 参数名*/function getUrlParam(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null;}//如获取原创 2020-11-24 11:51:47 · 376 阅读 · 0 评论 -
根据当前时间动态获取上一个月的时间及获取当月的最后一天
业务需求中,经常会根据当前时间获取上一个月的时间或者当月的最后一天,由于每个月的天数都不同,为了考虑时间上的准确性我们需要做一些判断和计算,具体方法如下:/* 获取上一个月时间,返回yyyy-MM-dd字符串* getLastMonthTime('2020-04-16','date'); date类型* getLastMonthTime(new Date,'num'); //时间戳类型* */function getLastMonthTime(date, type){ var daysIn原创 2020-07-03 13:50:32 · 1823 阅读 · 0 评论 -
iframe 子级获取父级元素
//获取父级元素 parent.$(window.parent.document).find(elem); //比如 子级页面控制父级元素隐藏 $(document).click(function (e) { parent.$(window.parent.document).find('.menuBar .menuLevel2').slideUp(); });...原创 2020-03-11 10:56:24 · 2413 阅读 · 0 评论 -
js用html2canvas.js实现包含非可视区域内容的截屏下载
由于项目开发需求,需要将表格数据以图片形式下载到本地,之前有了解到ExportPrint.js插件,可以将页面元素以图片形式下载导出,但此方法只适用于出现纵向滚动轴的页面,当有横向滚动轴时页面只会截取可视区域内容。借助网友的智慧(js截取页面内容、生成png(包括非可视区域)、下载到本地)实现了包含非可视区域内容的图片导出下载,方法如下:一、HTML// table内容为导出元素,该功能是用b...原创 2019-09-09 13:22:34 · 1979 阅读 · 0 评论 -
用加载图片解决在ajax数据加载中页面出现短暂空白的问题
在项目中用ajax异步获取数据后有时会因为数据问题或者网络问题,页面一直显示空白,现在用加载图片来过渡这种状态:&lt;script&gt; $(function(){ $.ajax({ url:'',//提供接口的文件地址链接 dataType:'json', type:'POST',原创 2016-12-10 16:11:10 · 2508 阅读 · 0 评论 -
【JS】用JS实现系统登录页的登录和验证
这篇文章用JS显示表单的登录以及验证和对键盘的监听,这里有两种方法,一种是无需用户验证直接登录,一种是需要账户密码匹配才可登录。1. html代码<div class="content"> <div class="login-wrap"> <form id="user_login" action=&原创 2017-09-05 17:24:22 · 66395 阅读 · 19 评论 -
【JS】用JS实现带cookies保存记录的换肤功能
用JS实现带cookies功能的换肤功能由于项目需要研究了一下换肤功能,代码简洁易懂,首先需要根据自己的皮肤主题提前把自己所写的样式放在对应名字的css文件里,然后将选择主题的点击事件保存在cookies记录里,读取cookies记录,如果记录不为空则根据记录设置皮肤,不然选择默认皮肤。 1. HTML代码 ** 换肤原创 2017-09-01 17:50:46 · 1087 阅读 · 0 评论 -
关于 Javascript 学习,有哪些好的博客或者网站推荐?
最近一直在菜鸟教程上自学js,虽然在实际开发项目中也学过js,但大多是对网上的资源复制粘贴修修改改,偶然间在知乎上看到干货果断总结一下分享给大家,也希望原主不要介意,好资源大家分享一下;一:JavaScript | MDN 这个是 Mozilla 开发者网络社区的学习资料,比W3school 要好,对于疏通JavaScript很有益处;二:想了解ECMAScript 6 入门的,转载 2016-10-22 13:41:14 · 4059 阅读 · 0 评论 -
【JS】用JS实现系统常见日周月时间按钮切换效果
这里的页面样式基于bootstrap.css样式文件,时间控件引用的是datetimepicker.js,如果想详细了解时间控件的操作,可以参考网址http://www.bootcss.com/p/bootstrap-datetimepicker/,本篇文章只简单介绍按钮控件的简单切换,先上效果图: 1.HTML div class="btnDataType pull-lef原创 2017-09-05 18:36:24 · 8582 阅读 · 5 评论 -
【JS】JS 实现父子窗体相互传值的三个方法
一、在开发项目过程中经常会需要用到父页面和子页面互相传值来获取参数数据,下面提供了三种总结的比较好用的方法,本例子需要下载bootstrap-table.js、layer.js文件,具体下载地址如下: https://github.com/wenzhixin/bootstrap-table; http://layer.layui.com/; 1、html页面 (1)父页面(tes原创 2017-12-08 11:45:56 · 7800 阅读 · 0 评论 -
【JS】JS实现登录页密码的显示和隐藏
在登录页经常会用到通过点击文本框的类似小眼睛图片来实现隐藏显示密码的功能,其实实现原理很简单,通过点击事件来改变input的type类型,具体过程看代码:<ul class="form-area"> <li> <div class="item-content"> <div class="item-input"> &原创 2017-12-05 14:19:32 · 6498 阅读 · 2 评论 -
【JS】JS 公告竖向、横线滚动效果
一:竖向滚动效果 1.html <div id="scroll_noticeMsg" class="noticeMsg"> <ul id="scroll_begin"> <li>数据一</li> <li>数据二</li> <li>数据三</li> <li>转载 2018-01-03 17:21:16 · 1898 阅读 · 0 评论 -
bootstrap-datetimepicker日期插件月份bug问题解决
用datetimepicker 时间插件获取日期的时间区间,但在应用过程中发现月份的选择有两个月的时间偏差,比如: 开始时间选择为2017-10,那结束时间的开始时间应该是在2017-10之后,但是视图显示2017年的8、9月份都可选,阅读插件源码有两处错误,一个是650行的月份获取错误;另一个是784行的时间选择器出现错误,错将时间视图中左右两个按钮的span元素放在了月份的span元素中,这样原创 2018-02-01 10:57:35 · 6645 阅读 · 0 评论 -
【JS】给layer弹窗的子页面表单赋值
在系统中经常会用到表格的增删改功能,通过触发编辑按钮事件来弹出表单窗体并给表单的内容项赋值, 这里通过结合layer.js和underscope.js可以轻松的实现此效果: 一 、js代码 我这里的表格用bootstrapTable实现,了解过此插件的猿友应该能读懂,不懂的请查看官网实例,这里我截取其中的一段操作列: { field: '', ...原创 2018-02-23 17:25:47 · 11199 阅读 · 3 评论 -
【JS】仿adminLTE 和layerUI风格用js实现后台框架(一)
侧边栏多级菜单的实现本篇用html+css+jq实现侧边栏的菜单功能,可实现侧边以及菜单的展开隐藏效果。 一、HTML&lt;aside class="sidebar"&gt; &lt;ul class="sidebar-menu"&gt; &lt;li class="header text-原创 2018-05-15 11:45:58 · 3702 阅读 · 6 评论 -
【JS】JS 实现父子页面通过URL传值
表格数据增删改的功能实现通常需要用到父子页面传值,当用户需要用到点击表格某一行查看详情或者编辑当前表格数据时,我们用以下方法便可轻松实现传值: 一:父页面Js//此处用的bootstrapTable创建表格 { field:'NAME', title:'名称', align:"left", width ...原创 2018-06-04 17:25:36 · 1062 阅读 · 0 评论 -
【JS】JS 实现文件的上传下载和删除
本篇运用html的input type=”file”属性已经结合bootstrapTable的布局框架实现对文件的上传,下载和删除操作: 一:Html 这里引入了bootstarp、bootstrap-table的js和css文件,请在百度上搜索官网地址下载所需文件:/*引用文件*/ &amp;amp;lt;link rel=&amp;quot;stylesheet&amp;quot; href=&amp;quot;原创 2018-06-06 14:14:33 · 6700 阅读 · 3 评论 -
【JS】html5+css3+js 用定时器实现时间轴的自动播放
本篇介绍了用css3实现时间轴样式,用jq实现时间轴的自动轮播和启动暂停事件,具体代码如下: 一、time.html &lt;div class="heatMapTimer"&gt; &lt;ul class="time-line"&gt; &lt;li class="time原创 2018-07-23 16:21:56 · 4376 阅读 · 1 评论 -
【JS】JS 正则验证电话联系方式
function ValidatePhone(val){ var isPhone = /^([0-9]{3,4}-)?[0-9]{7,8}$/;//手机号码 var isMob= /^0?1[3|4|5|8][0-9]\d{8}$/;// 座机格式 if(isMob.test(val)||isPhone.test(val)){ return true;原创 2017-12-19 16:42:47 · 17682 阅读 · 0 评论 -
【JS】js 对字符串进行加密解密
//对字符串进行加密function compileStr(code){ var c=String.fromCharCode(code.charCodeAt(0)+code.length); for(var i=1;i<code.length;i++){ c+=String.fromCharCode(code.charCodeAt(i)+code.charCode转载 2017-09-27 13:29:49 · 1568 阅读 · 0 评论 -
【JS】html5 postMessage解决跨域、跨窗口消息传递
转载地址:http://www.cnblogs.com/dolphinX/p/3464056.html转载 2017-10-12 17:19:28 · 273 阅读 · 0 评论 -
【JS】用js实现地图窗体自适应不同的浏览器高度
//调用方法 autodivheight(); function autodivheight(){ //函数:获取尺寸 //获取浏览器窗口高度 var winHeight=0; if (window.innerHeight) winHeight = window.innerHeight; else if原创 2017-09-25 16:44:27 · 1053 阅读 · 0 评论 -
【JS】javascript实现多栏目切换
在网站开发中尤其是新闻类网站,经常遇到多栏目切换的设计,这种效果有很多种实现效果,现在记录一种很简单的写法: <style> .news_wrap{ width: 380px; height: 266px; float: left; margin-left: 15px; } .news_head{ width: 380px; bo原创 2016-12-12 10:22:12 · 1260 阅读 · 0 评论