- 博客(36)
- 收藏
- 关注
原创 支付宝小程序request封装
在项目文件夹的根目录中创建utils文件夹,在utils文件夹中创建request.js文件,如图复制粘贴以下内容//ajax封装let app = getApp()export function request(config) { // 加载loading my.showLoading(); var sess = my.getStorageSync({ key: 'sess' }); sess= sess.data let host = app.globalDat
2021-09-22 14:42:05
1107
原创 纯css兼容iphonex以上手机底部横线问题
padding-bottom: 0;padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);
2021-09-22 14:24:27
290
原创 用css绘制一个三角形的div
以倒三角为例:div{width: 0;height: 0;border-left: 50px solid transparent;border-right: 50px solid transparent;border-top: 100px solid red;}左右两边边长为50透明上边边长100显示出来的就是一个红色面积的倒三角
2020-12-03 16:56:39
327
1
原创 ios中 input和textarea兼容问题
input和textarea在设置了disabled属性后,设定的css样式在ios中会改变或失效解决方法:可以用readonly=“readonly”代替disabled
2020-12-03 16:51:40
316
原创 input输入框限制小数后两位 && 正整数验证
在用户输入金钱相关的输入框时,需要限制小数点后两位html:<input type="number" onkeyup="num(this)" />js:function num(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符 obj.value = obj.value.replace(/^\./g,""); //验证第一个字符是数字 obj.value = obj.val
2020-12-03 16:42:37
239
原创 ios h5页面滑动不流畅
h5页面在ios上,部分滚动区域会出现滑动僵硬,不流畅的问题。解决方案:在滑动区域加上css-webkit-overflow-scrolling: touch;
2020-12-03 16:38:10
276
原创 iponeX以上机型判断
h5中:function isIphonex () { if (typeof window !== 'undefined' && window) { return /iphone/gi.test(window.navigator.userAgent) && window.screen.height >= 812; } return false;};小程序中wx.getSystemInfo({ success:
2020-09-17 11:31:09
256
原创 IOS时间格式化兼容问题记录
在格式化时间时new Date('2020-7-6 12:00:00')这种写法在IOS系统中 可能会出现NaN的情况原因是IOS不支持 2020-7-7 这种时间格式需要转换为 2020/7/6可以使用repalce方法进行替换var newStr = oldSrt.replace(/-/g,'/');...
2020-07-06 10:50:05
260
原创 小程序分享页面后接收参数不完整问题
需求:用webview分享h5页面后,打开为分享的h5页面(而不是首页)思路:分享小程序时,在路由里面添加url参数,点开时获取参数,加载对应的页面问题:获取的参数不完成解决方法:使用 encodeURIComponent()方法将url字符串进行编码。在接收的时候使用decodeURIComponent()方法解码。这样即可保持传递的url完整...
2020-05-15 17:24:08
688
原创 【小程序】获取webview中当前的url
由于webview的src只能获取到第一层。比如,webview的src属性设置了’www.baidu.com’,当你在webview中点击或者搜索,页面跳转后,是无法获取当前webview的url的(src始终是’www.baidu.com’)。这个参数可以在分享配置中获取onShareAppMessage(option){ var nowUrl = option.webViewUrl console.log(nowUrl )}...
2020-05-14 17:57:40
4750
1
原创 移动端左右滑动事件记录
监测滑动,主要用到了三个事件touchStart:手指按下时触发该事件touchMove:手指移动时触发该事件 (持续触发)touchEnd:手指松开时触发该事件这里用的是vue的写法data(){ return{ startX:0,//开始触摸的位置 endX:0,//结束触摸的位置 disX:0,//移动距离 moveFlag:0,//是否在滑动 }}meth...
2020-04-22 11:53:04
311
原创 网页资源的预加载preloadjs
PreloadJS是一个用来管理和协调相关资源加载的类库,它可以方便的帮助你预先加载相关资源例如:图片 文件 音频 数据 等等首先需要引入preloadjs文件分享一个在线引用的网站:https://www.bootcdn.cn/preloadjs在线引用地址:<script src="https://cdn.bootcss.com/PreloadJS/1.0.1/preloa...
2020-04-10 16:51:13
801
原创 a标签的target属性及跳转问题
需求:再iframe中的子页面进行跳转时需要进行整个页面的跳转语法:<a target="_blank|_self|_parent|_top|framename"></a>值描述_blank在新窗口中打开被链接文档。_self默认。在相同的框架中打开被链接文档。_blank在新窗口中打开被链接文档。_top在父框架集中打...
2020-04-08 14:50:04
1358
原创 jq ajax请求时实现loading加载效果
当ajax请求时间较长的时候,往往需要添加加载效果。这里以jQuery的ajax举例。$.ajax({ timeout:1000,//设置请求的超时时长单位为毫秒 beforeSend(){ //请求中,这里显示loading框 }, success(res){ //请求成功的回调 }, complete(XMLHttpRequest,status){ //请求完成(不论...
2020-04-07 18:20:00
1469
原创 url中hash的手动添加和监听
在url上添加hash值,不跳转页面。可以使用location.hash = 1监听:window.onhashchange = function(){}当url中的hash值改变时,会触发上面的回调
2020-04-07 18:06:55
1044
原创 【vue】动态绑定class的方法
html:<p :class="{myClass:isAction}"></p>css:.myClass{ color:red;}js:isAction:true/false;即可根据isAction的值来动态渲染元素p的class另外,动态绑定的class可以和固定的class共存,即:<p class="big" :class="{myC...
2020-03-31 10:21:36
178
原创 判断当前h5环境是在小程序还是在公众号
var ua = navigator.userAgent.toLowerCase();if(ua.match(/MicroMessenger/i)=="micromessenger") { wx.miniProgram.getEnv((res)=>{ if (res.miniprogram) { //在小程序 ...
2020-01-07 17:14:14
3944
1
原创 iframe父子页面传值
iframe是一个可以直接引用网页链接的框架,在写页面逻辑时,往往会遇到子页面逻辑和父页面逻辑的沟通。iframe的父子网页可以通过相互调用对方的方法,来达到逻辑交互的效果;1.父调用子的方法: $("#iframe")[0].contentWindow.sonMethod();2.父获取子中的元素$('#iframe').contents().find("#sonEle");3....
2019-12-31 17:32:06
196
原创 flex布局 关于space-between最后一行向左对齐的解决方法
space-between是flex布局中,一种两端对齐的排列方法,当最后一排的元素个数不足时,会自动向两端散开或居中。解决方法:主要思路为在父元素里面添加一个after伪元素,宽度与子元素宽度相同当排列方式为一行两个、三个时HTML<div class="father"> <div class="son"></div></div>...
2019-12-30 15:47:41
2809
原创 移动端适配代码收藏
rem布局<script defer="defer" language="Javascript">var adaptive={};(function(e,g){var h=e.document;var b=h.documentElement;var j=e.devicePixelRatio;var i=1;var c=1;function k(){var m=/iphone/gi.t...
2019-12-20 16:42:22
211
原创 用mpvue框架实现人脸录入 及 问题记录
系统人脸录入步骤:用户授权相机->拍照->认证->录入系统认证和拍照主要用到小程序的该标签主要用到的属性device-position:摄像头朝向bindstop:摄像头在非正常终止时触发,如退出后台等情况binderror:用户不允许使用摄像头时触发bindscancode:在扫码识别成功时触发,仅在 mode=“scanCode” 时生效详情可以查看官方文档:...
2019-12-16 10:43:29
339
原创 websocket(im.js)的使用记录
需求:制作前台大屏幕,当卡种变化、有新的购卡信息或任务完成信息时,需要实时刷新数据。需要用到websocket进行实时通信。主要代码引用im.js<script src="/assets/newugo/pc/basis/script/GoBelieveIO/im.js"></script>定义observer对象var observer={ h...
2019-12-05 16:33:35
709
1
原创 或许会用到的一些js函数整理
1.时间戳转几(月、周、天。。)前function handleDate(dateTimeStamp) { var dateTimeStamp=dateTimeStamp*1000; var minute = 1000 * 60; var hour = minute * 60; var day = hour * 24; ...
2019-12-05 16:23:40
106
原创 关于手机熄屏事件
问题复现:在设定一个计时器后,如果熄灭屏幕,计时器会停止工作。解决方法:监视手机的熄屏事件,回到屏幕时刷新页面,矫正定时器解决代码:document.addEventListener("visibilitychange", () =>{ if (document.hidden) { //熄屏事件 } else { //重新亮起屏幕 ...
2019-12-05 16:10:56
393
原创 常用的meta记录
SEO优化页面关键词。<meta name="keywords" content="your tags" />页面描述。<meta name="description" content="150 words" />页面重定向和刷新:content内的数字代表时间(秒),既多少时间后刷新。如果加url,则会重定向到指定网页。<meta http-equi...
2019-11-18 16:57:37
104
原创 解决IOS输入框会把页面顶起问题
问题复现:在ios上,页面为自适应屏幕的fixed定位。在一次input聚焦,键盘弹起后,会把定位的元素位置打乱解决办法:(/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener(‘blur’,event => {// 当页面没出现滚动条时才执行,因为有滚动条时,不会出...
2019-11-04 10:40:19
2765
原创 FastClick
为什么要使用FastClick?移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件,这是为了检查用户是否在做双击。为了能够立即响应用户的点击事件,才有了FastClick。FastClick的使用在页面直接引入fastclick.js<script type='application/javascript' src='/path/to/fastclick.js...
2019-10-30 10:33:34
145
原创 获取URL指定参数的方法分享
直接复制粘贴可用function getUrlParam(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r!=null) retu...
2019-10-30 10:27:39
268
原创 关于样式的一些记录
input 背景色透明 background-color:transparentinput 聚焦时不显示边框 outline:none;文本超出长度显示省略号:overflow: hidden; text-overflow:ellipsis; white-space: nowrap;自定义字体:@font-face { font-family: ‘baby’; src: url...
2019-10-29 15:07:00
118
原创 键盘事件:如何辨别机器和人触发的事件
复现问题:已经签到后的人员未关闭签到框,扫码器扫描另一个人员,则之前的人员会离场原因:扫码器触发了一次回车事件解决思路:屏蔽扫码器触发的回车事件;通过两次键盘事件触发的间隔来判断,因为扫码器按键间隔很短(本地测试大概只有1-4毫秒),而人为操作则比较长(快速双击键盘大概100+毫秒),通过间隔事件来判定是否需要触发回车事件;解决代码: var lastPress =(new Date...
2019-10-17 17:50:16
190
原创 第二次打开小程序参数没有传递问题
在一次项目需求中,需要通过扫小程序二维码进入小程序。第一次扫码后能正常进入,再次扫码(不同店铺),显示的是第一次的店铺分析:第二次扫描时,店铺的id没有通过二维码传递到页面。通过不断尝试,又发现,如果扫描第一次以后,完全关闭小程序,则第二次也能正常传参。只有在小程序没有完全关闭(及小程序仅切换到后台)时,参数没有正常传递。分析:微信小程序生命周期相关解决:把onLaunch里获取店铺id...
2019-08-15 15:25:01
1008
1
原创 关于vue中修改elementui默认样式的问题
问题:修改elementui默认样式的时候,如果把样式写在该组件中修改样式,选择器加上根节点的class名或id名即可。
2019-06-12 10:50:08
1804
原创 解决事件委托,无法获取该元素的自定义属性值问题
首先在从数据库查数据并显示的过程中,把删除按钮设置了一个自定义属性data-id,其值等于对应的商品id。在写删除事件时,用事件委托的形式为该元素添加点击事件,并需要获取其 data-id 的值代码如下:$(’#tbody’).on(‘click’,’.del_shop’,()=>{let cart_id = $(this).attr(‘data_id’);console.log...
2019-04-30 09:36:45
1034
1
转载 gulp 4.0
gulp.task 移除了三参数语法,现在不能使用数组来指定一个任务的依赖。gulp 4.0 加入了 gulp.series 和 gulp.parallel 来实现任务的串行化和并行化。任务函数中,如果任务是同步的,需要使用 done 回调。这样做是为了让 gulp 知道你的任务何时完成。类似这样:gulp.task(‘a’, function(done){//sync task…done...
2019-04-16 09:02:29
266
原创 解决用jquery的ajax上传formdata对象的问题
在上传文件的过程中,接收上传的文件需要new 一个FormData对象,代码如下let formdata = new FormData($(’#form1’)[0]);之后向后台发起ajax请求$.ajax({type:‘post’,url:’/uploadFile.do’,data:formdata,success:(data)=>{alert(data);}})})...
2019-04-11 14:22:34
1289
原创 事件的解绑
在完成管理系统项目过程中,有一个点击事件,用于添加一条信息。完成基本的js代码后发现BUG:第一次可以正常的添加一条数据第二次会添加两条相同数据第三次会添加三条相同数据,以此类推原因:因为之前绑定了事件,没有进行解绑操作解决方法$(".element").off(‘click’).click(function(){});...
2019-03-25 16:29:00
190
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人