前端
文章平均质量分 62
涛々
一切皆有可能!
展开
-
css 不选最后一个元素
last-child 选择器匹配属于其父元素的最后一个子元素的每个元素。:not(selector) 选择器匹配非指定元素/选择器的每个元素。可以选择除了最后一个元素的所有元素。先用last-child选最后一个。正常情况下这样选择会全部选择。加上not就可以进行反选了。原创 2023-03-27 00:53:41 · 5627 阅读 · 0 评论 -
uniapp + uView1.0 H5端 解决跨域问题
uniapp + uView1.0 H5端 解决跨域问题原创 2022-10-07 23:51:13 · 1533 阅读 · 0 评论 -
uView1.0 无痛刷新token
uView1.0 无痛刷新token原创 2022-10-07 22:32:25 · 799 阅读 · 0 评论 -
CSS 奇思妙想边框动画
今天逛博客网站 -- shoptalkshow,看到这样一个界面,非常有意思:觉得它的风格很独特,尤其是其中一些边框。嘿嘿,所以来一篇边框特辑,看看运用 CSS,可以在边框上整些什么花样。border 属性谈到边框,首先会想到 border,我们最常用的莫过于 solid,dashed,上图中便出现了 dashed。除了最常见的 solid,dashed,CSS border 还支持 none,hidden, dotted, double, groove, ridge, inset,转载 2021-02-24 20:53:35 · 427 阅读 · 2 评论 -
小程序 搜索结果关键字标红(支持拼音)
试用场景:根据搜索关键字,请求服务端接口后返回的搜索结果,然后关键词进行标红处理效果: 图一 (基本的根据搜索关键词标红), 图二 (可根据拼音如“a”,查找结果中所有出现的文字中带拼音“a”的,然后标红处理)接下来贴上部分关键代码:<!-- wxml --><block wx:for="{{item.news_xqadd}}" wx:for-item="item2" wx:key="index"> <text wx...原创 2020-05-24 00:11:01 · 6038 阅读 · 0 评论 -
小程序 处理页面频繁的setData操作
// 500毫秒执行一次clearTimeout(that.timeoutId);that.timeoutId = setTimeout(() => { that.setData({ isShowSuspend: true }); delete that.timeoutId;}, 500);记录一下~原创 2020-04-19 14:01:57 · 1354 阅读 · 0 评论 -
flex布局,解决最后一排数量不够自动向两端对齐的问题(适合所有列的布局:3列、4列、5列等等)推荐使用!
<!-- HTML --><view class="v1"> <view class="v1-v1"> ...... </view> <view class="v1-v1"> ...... </view> ......</view&g...原创 2020-01-21 09:53:16 · 5443 阅读 · 9 评论 -
CSS 对话框小三角效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>H5 对话框</title> <style> * { margin: 0; padd...原创 2019-12-27 17:55:01 · 573 阅读 · 0 评论 -
微信H5网页 常用的JS操作
更新时间:2019-12-11 亲测可用一、禁止浏览器回退/返回// 禁止浏览器回退/返回function banReturn() { XBack = {}; (function (XBack) { XBack.STATE = 'x - back'; XBack.element; XBack.onPopState ...原创 2019-10-18 14:51:27 · 1103 阅读 · 0 评论 -
微信小程序 《数字华容道》
简单的做了个数字华容道的小游戏,大概长这样页面有点简单,但是大概的功能应该差不多都有了。这个小游戏的难点主要有两个:① 如何移动?// 移动算法isPass: false, // 是否通关goMove(e) { // 通关 或者 没开始游戏 就不能移动 if (this.isPass || !this.isStart) return; let i...原创 2019-09-20 11:54:41 · 4718 阅读 · 6 评论 -
解决微信H5网页分享报错:fail link must be in js secure domain list
fail link must be in js secure domain list //失败链接必须在js安全域列表正常来说碰到这个问题,是分享的链接没有在公众号的后台配置JS接口安全域名,配置完就不会报这个错误了。但是还有一种情况就是,你分享链接的地址上有带中文的参数,这样在安卓上分享是可以正常分享,但是在ios上会出现报错,导致你分享标题、描述、图片等都失效了:...原创 2019-09-12 17:53:57 · 9082 阅读 · 3 评论 -
小程序 canvas 绘制圆角矩形
/** * 绘制圆角矩形 * @param {Object} ctx - canvas组件的绘图上下文 * @param {Number} x - 矩形的x坐标 * @param {Number} y - 矩形的y坐标 * @param {Number} w - 矩形的宽度 * @param {Number} h - 矩形的高度 * @param {Number} r - 矩形的圆...原创 2019-08-22 11:50:17 · 6740 阅读 · 7 评论 -
CSS 段落、文字避头尾法则 同AI上的效果一样(非常好用哦~)
.a { table-layout: fixed; /*文字避首尾 -- 防止撑开*/ word-wrap: break-word; /*英文单字因自动换行*/ word-break:normal; /*正常避头尾*/ text-align:justify; /*文字左右对齐*/ text-justify: inter-ideograp...原创 2019-08-21 17:02:05 · 4531 阅读 · 0 评论 -
CSS 单(多)行文本超过部分显示省略号,解决数字或英文不换行问题
单行文本超过部分显示省略号.a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}多行文本超过部分显示省略号,并且兼容数字或英文不换行问题.a { white-space: normal; overflow: hidden; text-overflow...原创 2019-08-19 10:05:31 · 6405 阅读 · 0 评论 -
微信小程序 自定义组件之《波浪效果》
先看效果:组件属性:waveNum = 1; // 设置显示的波浪数量,只有1和2两个值, 最多只有两条波浪在动waveStatus = true; // 设置动画运行状态 true:动画在运行 false: 动画暂停background = '#7ec0eb'; // 设置波浪的颜色 默认蓝色引用:<!-- .wxml -->// 可以在外...原创 2019-07-23 11:46:41 · 3329 阅读 · 5 评论 -
小程序自定义组件的坑: thirdScriptError sdk uncaught third Error Cannot read property 'name' of undefined
最近在开发微信小程序的自定义组件转盘类的,不小心又踩坑里去了。。。调试器上出现这种报错:thirdScriptError sdk uncaught third Error Cannot read property 'name' of undefined TypeError: Cannot read property 'name' of undefined仔细检查了代码半天,感...原创 2018-07-26 23:29:13 · 37227 阅读 · 5 评论 -
微信小程序/H5/APP 上传图片至阿里云OSS(支持多图片上传)
我们先讲下为什么要把图片文件上传到云服务器呢, 有什么好处呢?1、能减轻我们自己服务器的带宽如果一个程序里有多处地方用到用户上传图片等功能的话,建议还是放到阿里云或者千牛云等其他平台上来存储我们的图片,可以给公司的服务器减少很多压力,磁盘存储也就不会太大2、提升用户体验感我们开发的产品一般都是以用户体验感为主对吧?当用户在使用我们的小程序上传图片时,如果一次上传了多张,我们的服...原创 2018-08-05 02:13:33 · 19149 阅读 · 53 评论 -
解决 微信小程序获取用户信息时弹框不显示的问题
在开发中碰到用户点击按钮获取用户信息时,弹框出不来的情况wxml:<button class='btn' bindgetuserinfo="loginClick" open-type="getUserInfo">请授权</button>js:loginClick(e) { console.log(e);}js的这种定义一个函数的写法,一般苹果...原创 2018-08-19 00:22:32 · 12423 阅读 · 4 评论 -
JS 生成永不重复的随机序列号
序列号由大小写字母 + 数字组成,直接上代码:function getRandomCode(length) { if (length > 0) { var data = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9",原创 2018-09-18 23:22:03 · 15146 阅读 · 4 评论 -
JS 倒计时(微信小程序)
下面的例子是微信小程序的写法和web端的都是差不多的,只是显示在页面的写法不一样: var timer = null; /** * 倒计时 * @param time 服务端传来的时间戳 */ function countdown(time) { var that = this; timer = setInterval(fun...原创 2018-09-19 00:20:14 · 2976 阅读 · 0 评论 -
JS处理带有小数点的字符串格式金额
"1.45" 把这样的带有小数点的字符串转为数字类型,一般都是用到 parseFloat 吧 ?这样如果遇到一些特殊的值,再 parseFloat 后结果会变成:1.46 这样解决:money: function (money) { return parseFloat(parseFloat(money* 100).toFixed(2));}这样你传的是什么值转换后的也...原创 2018-09-14 14:01:36 · 2989 阅读 · 0 评论 -
《Koa2进阶学习笔记》
记录一下文档学习地址,以后有用到时好找 0.0: https://chenshenhai.github.io/koa2-note/原创 2019-01-22 14:31:12 · 445 阅读 · 0 评论 -
web前端 腾讯地图 根据详细地址获取经纬度
先去腾讯地图官网申请开发密钥(Key) https://lbs.qq.com/guides/startup.html根据提示来操作就好。申请完后继续以下操作://jsonp的跨域请求$.ajax({ type: "get", dataType: 'jsonp', data: { key: "", // 填申请到的key ...原创 2019-01-31 15:11:20 · 10590 阅读 · 0 评论 -
wangEditor 轻量级 web 富文本编辑器
【介绍】wangEditor 是基于javascript和css开发的 Web富文本编辑器, 轻量、简洁、易用、开源免费。官网地址:http://www.wangeditor.com/【下载】点击 https://github.com/wangfupeng1988/wangEditor/releases 下载最新版。进入release文件夹下找到wangEditor.js或者w...原创 2019-01-22 14:19:24 · 1460 阅读 · 0 评论 -
web前端 图片压缩后上传到阿里云oss
当项目中有图片上传功能时,一般公司都是使用第三方的存储平台,这样便不会产生自己服务器资源占用问题,为避免上传图片太大占用太多空间,提高用户访问的速度,需要将图片进行压缩之后再存储。下面直接贴代码:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <!-- la...原创 2019-01-22 15:47:50 · 7305 阅读 · 4 评论 -
微信小程序:防止按钮多次点击跳转(函数节流)
场景在使用小程序的时候会出现这样一种情况:当网络条件差或卡顿的情况下,使用者会认为点击无效而进行多次点击,最后出现多次跳转页面的情况,就像下图(快速点击了两次):解决办法然后从轻松理解JS函数节流和函数 ... 场景 在使用小程序的时候会出现这样一种情况:当网络条件差或卡顿的情况下,使用者会认为点击无效而进行多次点击,最后出现多次跳转页面的情况,就像下图(快速点击了两次):...转载 2019-04-19 21:44:53 · 3294 阅读 · 2 评论 -
微信小程序 自定义组件之《转盘》
微信小程序自定义组件转盘原创 2018-07-29 22:12:58 · 73776 阅读 · 66 评论