- 博客(27)
- 收藏
- 关注
RSS订阅原创 微信内置浏览器打开的H5页面支付（前端开发角度）
场景： 用户通过消息或扫描二维码在微信内打开网页。开发步骤：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3 没有什么比看官方文档更直接的了。 但是步骤中有提到获取openId的步骤，对于没有开发过微信公众号的朋友来说就有点一头雾水了：怎么获取？ 获取openId的步骤: https:/...
2019-08-16 16:57:28
5997
原创 vue2.0使用mint-ui的datetimepicker插件（功能扩展）
简述：这篇博客主要内容是mintui的datetimepicker插件的扩展使用。基础的引入和使用都可以在官方文档中查到，这里就不再赘述，我的项目中需要有一个前一天、后一天的快捷入口，需要与datepicker插件联动起来，先讲一下大致实现：需求：这么一个样式，右侧为前一天后一天的切换，同时需要左侧时间联动变化。贴代码：template：<div class="fl" @cli...
2019-06-05 16:14:09
2124
转载 mark一下前端基础进阶的文章
讲的很好，以后还会多次翻看，推荐给大家https://www.jianshu.com/p/cd3fee40ef59
2018-11-12 10:29:57
167
原创 elementUI时间控件Maximum call stack size exceeded的问题
做多页面，单独引用vue.js，当vue.js是V2.5.17-beta.0 版本时，使用时间控件会报Maximum call stack size exceeded，当换到V2.5.16版本时就不会出现这个问题了
2018-09-19 10:23:31
2453
原创 接口返回二进制文件流，前端通过blob对象实现下载
场景：项目中请求图片或者下载文件一般情况下都是接口返回url或者接口本身就是一个get请求访问接口直接下载。但是在某些情况下，接口会返回一个二进制文件流，在控制台打印或者network的preview中就是一串看不懂的字符串（下图）第一次遇到的时候也是一脸迷茫，就顺着惯性思维总觉得接口返回的不对。但其实只是自己技术有限，没有接触到而已。这就是接口返回的文件的二进制流，通过js的Blob对象...
2018-09-06 16:15:57
40454
18
原创 浏览器的记住密码，autocomplete= "new-password"解决
在项目中有记住密码的勾选功能，要求无论是否勾选都记住帐号，在逻辑上都走通后，测试阶段出现了bug：无论是否勾选记住密码，密码都会自动填充。经过排查，是因为浏览器的记住密码功能影响的。目前最优的解决办法是在input type="password"输入框中加上autocomplete = "new-password"属性，163邮箱也是又用到的。在寻找解决办法的时候有了解到浏览器记住密码自动...
2018-08-10 16:53:22
22541
1
原创 vue项目中锚点定位替代
在vue项目中，使用锚点定位会和router的规则冲突，在项目中的表现就是第一次点击url改变了，但是没有跳转到锚点位置，再次点击才会跳转。所以在vue项目中定义一个方法不适用锚点定位： scrollToSection() { let section = document.getElementById('section') if (section) { ...
2018-08-02 16:02:01
1304
转载 vue项目proxyTable配置和部署服务器的问题
在localhost环境下跑项目时，接口地址是 http://xxxx.com/save/index 这样的接口地址，我们这样直接使用会存在跨域的请求，导致接口请求不成功，我们进入 config/index.js 代码下如下配置即可。dev: { // 静态资源文件夹 assetsSubDirectory: 'static', // 发布路径 assetsPu...
2018-07-18 18:28:36
19572
原创 vue自动滚动到容器底部
做实时聊天时用到的场景：使用侦听属性watch，侦听改变的变量Talkwatch: { Talk() { this.$nextTick(() => { var container = this.$el.querySelector('#talk') container.scrollTop = container.scrollHeight ...
2018-07-12 16:00:03
11334
原创 IE11下，打开控制台并选中始终从服务器刷新才能正确访问到接口的问题解决
问题如标题描述，必须选中这个，才能获取到正确的后台数据，原因：由于IE缓存机制的问题，首次执行ajax的URL，进行缓存，再执行时，同一URL地址，不会在变化。解决方法：创建动态的URL地址。给ajax的请求url一个假的动态路径，从而来骗取浏览器的请求原请求接口：'/api/getData'改变后写法：'/api/getData?v=' + Math.random(10)...
2018-07-05 09:27:03
2094
原创 二倍图整合雪碧图
在优化项目ui过程中遇到的问题，ui切图为2倍图，做背景图整合时候使用定位和CSS3的scale来实现，具体按实际情况调整。结果肉眼看出来是没什么差别的
2018-05-07 16:09:57
1296
原创 小程序scroll-view区域滚动到最底部
需求：用到这个需求的地方是在做一个对话页面，scroll-view区域要显示到最新的信息，也就是滚动到最底部。思路：绑定scroll-view的scroll-top属性，在每次监听到事件或者websocket回调时设置其值，当大于scroll-view的列表高度的时候就会显示到最底部了。wxml:<scroll-view scroll-y='true' scroll-top="{{scrol...
2018-04-17 16:47:51
18805
原创 正则验证：必须且只包含数字和字母
passwordReg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,10}$/;^匹配一行的开头位置(?![0-9]+$)预测该位置后面不全是数字(?![a-zA-Z]+$)预测该位置后面不全是字母[0-9A-Za-z]{6,10}由6-10位数字或这字母组成$匹配行结尾位置身份证正则：idCardRegex = /^...
2018-01-16 10:48:17
6793
转载 js和jq获取宽高上下距离的方法
jquery获取 $(window).height() //浏览器当前窗口可视区域高度 $(document).height() //浏览器当前窗口文档的高度 $(document.body).height()//浏览器当前窗口文档body的高度 $(document.body).outerHeight(true)//浏览器当前窗口文档body的总高度 包括border padd
2017-12-12 10:25:03
257
原创 分页插件
网上找的源码，根据自己的需求做了一点小修改，记录下来html：js：(function($){var ms = {init:function(obj,args){return (function(){ms.fillHtml(obj,args);ms.bindEvent(obj,args);})();},//填充htmlfillHtml
2017-12-01 17:03:58
243
原创 echarts2地图省份依次高亮显示的demo
在echarts2中我找不到dispatchAction的方法，所以通过多次setOption来实现省份的逐个高亮代码：var mycharts = echarts.init(document.getElementById('charts'))option = { series : [ { name: '中国',
2017-11-24 16:23:38
4048
2
原创 vue+element爬坑
写给自己，纪念爬过的坑：第一步：首先要装好node.js环境和npm，查看是不是比较高的版本 第二步：通过vue官网上的安装在init时候可以指定版本，或者在install之前修改package.json的配置来指定要安装的vue等依赖的版本（用elementui时候不知道为什么表格的全选不生效，网上有搜到说是版本问题！！！（并没有！不可能是版本问题）坑了一下午，感觉应该
2017-11-14 17:26:25
344
转载 监听后退事件和hash变化
var detectBack = {initialize: function() {//监听hashchange事件window.addEventListener('hashchange', function() {//为当前导航页附加一个tagthis.history.replaceState('hasHash', '', '');}, false);wind
2017-10-24 14:57:08
1329
转载 移动端a标签点击背景变色
一、取消a标签在移动端点击时的蓝色1234-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-user-select: none;-moz-user-focus: none;-moz-user-select: none;
2017-10-23 15:32:37
2963
转载 JS判断是移动端还是PC端浏览器打开
function goPAGE() { if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Win
2017-10-19 15:22:36
368
转载 时间戳转日期
JavaScript时间格式转换总结 1.当前系统区域设置格式(toLocaleDateString和toLocaleTimeString) 例子:(new Date()).toLocaleDateString() + " " + (new Date()).toLocaleTimeString()结果: 2008年1月29日 16:13:112.普通字符串(toDateString
2017-10-17 17:19:28
235
转载 多行文字隐藏部分...表示的css样式（webkit兼容）
使用css样式div{height: 20px; /* 容器高度 */overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; /* 行数 */-webkit-box-orient: vertical;font-size: 10px;};谷歌浏
2017-10-16 11:22:11
434
转载 判断网页是否由微信内置浏览器打开
function is_weixn() {var ua = navigator.userAgent.toLowerCase();if(ua.match(/MicroMessenger/i) == 'micromessenger') {alert('微信浏览器')return true;} else {alert('其他浏览器')return false;}}；
2017-09-18 15:34:30
598
原创 自己封装的轮播图
刚开始写页面的时候没有用网上的插件，又因为赶时间没有考虑用户体验，更新迭代时候换掉了。做法是将获取的图片复制然后添加到ul里，实现左右按钮切换时的无缝切换。自己做个笔记，以后用到的话直接拿来用了。var banner = {num:0,bstop:true,maxnum:0,slidernum:0};AJAX取到数据之后给变量赋值：banner.ma
2017-08-07 18:18:47
388
转载 网上资源找到的，html页面转canvas最后转为pdf格式。
通过html2canvas将html页面转换为图片，再将图片通过一定比例缩放生成pdf，点击触发下载事件。//依赖//下载生成的pdf文件document.getElementById('download').onclick = function() {this.parentNode.removeChild(this);html2canvas(documen
2017-07-21 09:23:27
540
转载 时间选择器
依赖//时间选择插件汉化jQuery(function($) {$("#timestart").datepicker({onSelect:function(dateText,inst){$("#timeend").datepicker("option","minDate",dateText);}});$("#timeend").datepicker({onS
2017-07-18 14:12:09
208
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人