- 博客(32)
- 收藏
- 关注
RSS订阅原创 js 处理json数组，通过name键值重新组装json并且合并相同name键值为数组
处理json数组，通过name键值重新组装json并且合并相同name键值为数组！
2022-08-30 19:13:39
625
1
原创 layui 利用tab选项卡实现：上一步，下一步操作
虽然闲心大大已经关闭layui官网，可他一直是我们jQuery族的骄傲，话不多说了效果如下：CSS/* 顺序tab */.order_tab .layui-tab-title{border: none !important;text-align: center;}.order_tab .layui-tab-title li+li{margin: 0 0 0 50px;}.order_tab .layui-tab-title li>span{width: 35px; height: 3.
2021-12-22 14:19:23
1993
转载 百度地图根据地址解析经纬度，点击获取地址及经纬度。
地址解析地址解析的含义其实就是，根据地址来解析到对应的位置，也就是地图上的经纬度。另外对应的还有一个名此处是 地址逆解析，也就是根据经纬度数值，来解析所处的地址。地址解析的类库是根据：BMap.Geocoderfunction geoCode(){ var myGeo = new BMap.Geocoder(); let address = "合肥市马鞍山路合肥工业大学" myGeo.getPoint(address,function (point) { i
2021-11-24 10:47:16
4051
原创 ajax 获取服务器时间
获取服务端时间let date = new Date($.ajax({async:false}).getResponseHeader("Date"));
2021-11-02 09:50:58
439
原创 antd Popover 气泡卡片，首次位置不对解决方法
解决Ant Design of Vue - Popover 气泡卡片 首次位置不对问题想要效果:首次进入效果：再次移入显示就对了，解决方法：加上高宽（:overlayStyle="{ ‘width’: ‘208.34px’, ‘height’: ‘267px’ }"）如下即可<a-popover title="Title" :overlayStyle="{ 'width': '208.34px', 'height': '267px' }"> <template .
2021-09-10 09:36:07
4243
原创 vue 设置元素上下双滚动条
在一个项目中需求不让有右侧有滚动条，考虑表过长需要table头部和底部都要有滚动条，如下图：也是奇葩需求，话不多说做都做了记录一下吧，万一能帮助同行小伙伴嘞！下边滚动条还是table的滚动条没动，我只给上面加了一个滚动条。HTML 保持与table滚动条一致，默认给了一个1像素高度（不然看不到）项目用的是 antd 框架，其他框架自个想办法获取宽度给下面代码保持一致。<div class="scrollbar" ref="scrollBar"> <div .
2021-07-20 11:03:01
1221
转载 H5 contenteditable 可编辑区域 以及 实现 placeholder
一：H5 元素内容可编辑contenteditable 是可以在元素上设置以使内容可编辑的属性。它适用于 DIV、P、UL 等元素。您必须指定它，例如，<element contenteditable="true|false">。注意: 当contenteditable元素上没有设置属性时，它将从其父元素继承。<h2> Shoppping List(Content Editable) </h2><ul class="content-editable"
2021-07-09 11:26:09
930
转载 VSCode编辑器-koroFileHeader插件
在团队中进行开发时，统一注释格式很重要。以下是记录如何在VScode中使用koroFileHeader来统一注释格式，效果如下图：安装在插件中查询插件koroFileHeader，安装配置打开设置-搜索：fileheader 点击：settings.json 如下图：我只配置了这一个文件，其它的自己百度吧！代码{ "git.ignoreWindowsGit27Warning": true, "fileheader.customMade": { .
2021-06-17 14:13:27
295
转载 vue draggable 拖拽组件
如效果图，很不错的拖拽组件：安装引入// npm i -S vuedraggable 安装import draggable from "vuedraggable"HTML<template> <div> <draggable delay="100" :options="{animation:150}" :no-transition-on-drag="true" ..
2021-03-23 11:11:19
158
原创 企业微信 WWOpenData 在 ECharts 渲染
ECharts 柱状图渲染企业微信 WWOpenData 数据根据需要渲染数据自己封装一下（部门数据示范）type 不用说吧：userName 用户，departmentName部门封装数据（后端返回数据封装成需要格式）// 拿到后台反的（部门dep_id）this.renderingData.push( { type:'departmentName', id: // dep_ids })this.Rendering(this.renderingData) // 传入数据
2021-03-15 17:37:14
1492
16
原创 vue 解决ios滑动出现两次过渡效果
抽屉似弹层，页面跳转右侧滑入左侧滑出过渡效果，在ios上用户不通过点击顶部自带返回，而是侧滑手机返回时过渡效果出现两次效果很不友好！页面跳转过渡效果解决方案vuexisIosMoveBack: false, // 判断过度动画取消的时机过渡页<template> <div> <transition :name="transitionName"> <router-view class="child-vie.
2021-03-12 15:42:33
1871
原创 腾讯云存储上传
// npm安装：npm i cos-js-sdk-v5 --saveimport COS from 'cos-js-sdk-v5'//上传腾讯云（data后端给的token等数据，file文件信息，obj回调）var uploadFile = (data,file,obj) => { var keyall = (new Date()).getTime() + '1' + Math.floor(Math.random() * 10000) // 当前时间戳+随机数 var c
2021-03-12 14:52:15
142
原创 vue 移动端路由（右侧进入，左侧退出）动画效果
最近在做移动端项目，头部没有导航返回按钮，需要手机自带物理返回，产品经理需求，点击跳转从右侧滑入，手机物理返回时从左侧退出，效果类似如下：但是不是点击返回按钮，从左侧退出，参照大神代码改的，话不多说入正题：1.新建一个：PageTransittion.vue 到项目目录（动画过渡页）HTML<template> <div> <transition :name="transitionName"> <ro.
2021-02-01 17:43:50
2351
4
原创 vue input输入监听
<input class="flex_1" type="number" placeholder="请输入" v-model="v.score_num" v-on:input="onCount($event,v)" onblur="if(value=='')value=0"/>methods:{ onCount(obj,res){ // console.log(obj,res) if(parseFloat(obj.target.value)>pars
2021-01-22 16:50:51
1664
原创 合并两个json对象为一个json对象
第一种（网上找的不美观）var json1 = { name: 'jack' };var json2 = { age: 18};var json3 = JSON.parse((JSON.stringify(json1) + JSON.stringify(json2)).replace(/}{/, ','));console.log(json3); //{name: "jack", age: 18}原贴: https://www.cnblogs.com/webmc/p/11095642.html
2021-01-18 17:45:42
1396
原创 移动端唤起键盘时挡住页面解决办法
在IOS和安卓中键盘弹起挡住输入框或者页面的解决方案我这里底部有个position:fixed;定位，移动端调起键盘是时挡住了输入框和页面，网上贴吧贴吧解决了这个问题，就是在调起键盘时取消定位，取消后自动在页面底部data(){ return{ oldFullHeight: 0, // 屏幕高度 select_show:true, // 键盘弹起状态 }}// 解决移动端唤起键盘输入框被挡住问题this.oldFullHeight = document.documen
2020-09-23 16:23:10
1331
原创 Vue 正则限制input只能输入大小字母加数字，每四个字符加个空格，最后四位不加空格
网上找了很多都不怎么满意，最后东拼西凑实现了，自我感觉完美嘻嘻html代码<input v-model="code_data" type="text" maxlength="24" @input="no_change" placeholder="请输入20位激活码">这里说一下虽然限制的输入20个字符但是最大却必须24位，因为空格也要站位！js代码// 非中文no_change(e) { var $this = e.target; // 获取dom // 正则.
2020-08-26 16:16:19
1595
原创 Vue 移动端-拖动-浮动元素
项目需求有个浮动按钮在屏幕右下角能拖动，能点击，话不多说代码走你：拖动 drag.js（方法参数定义的id名）// 拖动export default{ // 拖动 drag(obj){ var oL,oT,drag = document.getElementById(obj); //限制最大宽高，不让滑块出去 var maxW = document.body.clientWidth - drag.offsetWi
2020-08-18 16:53:25
576
原创 vue swiper轮播-实现移动端左中右三图有间隔无缝隙轮播
话不多说还在赶项目，效果如下图：只需安装 swiper 即可，不需要安装：vue-awesome-swipernpm install swiper --save-dev下面是否完整代码<template> <div class="swiper_all"> <div class="swiper-container"> <div class="swiper-wrapper"> <di
2020-08-11 11:47:14
2809
原创 移动端：安卓-IOS 常见坑持续更新
最近公众号做得比较多，对于安卓和ios兼容性来说一般在PC调试如：微信开发者工具调试没问题的安卓几乎都没什么大问题，但是对于ios来说就不一样了，从低点的iPhone 6 至 iPhone X等更高来说，兼容性问题各种各样的，本篇文章只是给自己长记性，帮不到你们的就别在意了！1.在iPhone 10以上公众号底部会有大概20像素白底解决方案：<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-
2020-08-05 21:13:25
295
原创 js 监听回退事件，并且阻止页面回退
最近做移动端项目，同页面全屏弹层为防止用户习惯用大返回关闭弹层，导致退出该页面，最后写了个监听大返回（回退）事件方法，代码如下：监听回退事件// 监听回退事件window.addEventListener("popstate", function(e) { // 这里写你想做的事：如关闭我关闭弹层}, false);禁止回退页面// 禁止回退页面function pushHistory() { var state = {title: "title",url: "#"};
2020-07-11 21:51:28
4345
2
转载 js 判断图片 url 地址是否有效，两种方式一起使用完美解决！
话不多说，经过各种方式，各种度娘最后终于找到最期望的了！//判断图片是否存在function is_img_url(imgurl) { return new Promise(function(resolve, reject) { var ImgObj = new Image(); //判断图片是否存在 ImgObj.src = imgurl; ImgObj.onload = function(res) { resolve(r
2020-07-11 21:16:55
9311
10
转载 解决 iPhone X 屏幕底部空白问题
最近做公众号发现 iPhone X 日了狗了，找了半天问题，最后还是度娘到了，很详细 走你-链接: https://www.jianshu.com/p/e4a7d95b288b
2020-06-30 18:44:19
2724
原创 纯CSS3底部滑动导航效果
闲来无事用css和jQuery写了个导航效果（可放开注释移除jQuery操作部分）html 部分<ul id='ul_all'><!-- <li class="active">首页</li> <li>首页1</li> <li>首页2</li> <li>首页3</li> <li>首页4</li> <li>首
2020-06-03 13:59:30
844
原创 input 实现输入标签，每个标签最长12个字符，最多输入6个，限制多个逗号以及中文逗号！
废话不多说纯手工！// 判断输入口味长度function flavor_length(obj){ // 中文逗号变英文逗号 var text = '',list = [],val = []; // 正则替换中文逗号 text = obj.value.replace(/，/g,','); // 字符串分割成数组 list = text.split(","); // 选好判断数组长度最多6个 $.each(list,function(i,d){
2020-05-29 10:30:02
2630
转载 vue 移动端 mescroll 精致上拉刷新下拉加载
最近用vue做公众号，用的mint-ui，公众号需要上拉刷新下拉加载，mint-ui也自己提供了上拉刷新下拉加载，但是他文档看着真的老壳痛，慢慢琢磨也写出来了，但是拉的时候各种问题，最后放弃了，于是在网上搜了一下也是没找到自己想要的，不过还好最后还是找到了一个好用的，叫：mescroll官网链接: http://www.mescroll.com/api.html#mescrollvue官网效果...
2020-05-07 18:59:05
666
原创 vue 移动端七牛云图片上传js，附图片base64转码+压缩js
最近做一个vue公众号项目需要上传用户身份证到七牛云上，本想网上找一个现成的，找了一些都不是很满意于是自己参照着写了一个，做得不好勿喷！HTML 代码<div class="upload_main"> <input type="file" class="uploadSelect" @change="uploadBack" accept="image/*" mult...
2020-05-07 18:32:58
828
转载 纯CSS3实现瀑布流布局，附解决布局错乱被截取解决办法
竖向瀑布流html页面结构 <div class="masonry"> <div class="item"> <img src="" alt=""> </div> <div class="item"> <img src="" a...
2020-05-03 00:17:15
2129
原创 vue + mint-ui 的 picker 省市区三级联动，以及编辑回显，可直接复制封为组件
最近用vue做一个公众号用到了mint-ui的picker，选择地区的三级联动，由于picker无法加载动态数据，经过各种百度，最后使用promise对象，将异步转换为同步。完美解决三级联动效果，文章借助于：https://blog.csdn.net/NAMECZ/article/details/85286095<template> <div> &...
2020-04-30 15:42:25
1118
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人