Q久夏青-优快云博客

原创用户定位JSSDK获取用户经度纬度配合腾讯地图组件

function mapBtn() { //封装的地图函数调用 var localUrl = window.location.href; var appid,timestamp,nonceStr,signature; $.ajax({ url:apiUrl+“jssdk”, type:‘post’, dataType:‘j...

2019-05-11 23:30:43 1585

原创封装弹框

封装 function funTips(title,content,targetUrl,img,targetTip) { var str =’’; str += <div class="popover_box" > <div class="popover"> <div class="popover_img"> <img src="${img}" alt="...

2019-05-11 23:23:33 281

做之前找了好多的插件，想用插件能尽快完成功能，不团队的后腿先说思路：把整体样式写好请求后台接口，拿到数据，并渲染到页面中，后台是一次性把题目全返回给我，而不是用户答一题，请求一下接口，再返回一条数据再渲染新的题目；这样就有个难题，一次性把数据渲染出来，怎么做到分页的效果，答一题切换下一题，花了时间找插件，但是很难完全切合运用，我们这么答题，没有按钮，就是用户答一题切一题，最后全部答完提交数据...

2019-05-11 23:19:00 743

转载移动端监听滑动事件

var startx, starty; //获得角度function getAngle(angx, angy) { return Math.atan2(angy, angx) * 180 / Math.PI;}; //根据起点终点返回方向 1向上 2向下 3向左 4向右 0未滑动function getDirection(startx, starty, en...

2019-07-01 21:44:58 1876

原创 Vue配置本地代理

基本配置Vue-cli3.0 vue.config.js module.exports = { devServer: { host: 'h5.anowl.net', //本机域名 port: 8080, ...

2019-07-01 21:07:59 1111

原创苹果手机点击无效

$(document).on('click', ".subject_box .subject_option label img", function () { $(this).closest('label').remove(); // 题目的长度 }); 给要点击元素增加 css样式 cursor:pointer 就可以了 ...

2019-06-25 21:41:10 544

转载 jq获取节点

1、jquery 获取元素(父节点,子节点,兄弟节点) $("#test1").parent(); // 父节点 $("#test1").parents(); // 全部父节点 $("#test1").parents(".mui-content"); $("#test").children(); // 全部子节点 $("#test").children("#test1"); $("#te...

2019-06-25 21:40:29 1687

原创 vue生命周期函数

生命周期一共四个八个钩子函数 12 属于初始渲染的周期 34属于生成插入节点的周期 56属于数据修改的周期 78属于销毁周期 beforeCreata：这一步什么东西都没有 html没加载 css没有 data和方法都没有所以没用 created：这个是data和方法生成节点尚未生成所以可以在这里请求一些接口把数据存起来 beforeMout: 这个是节点生成尚未插入h...

2019-06-25 21:38:09 307

原创 XAMPP配服务

xampp Config httpd.conf NameVirtualHost *:80 <VirtualHost *:80> DocumentRoot "C:/xampp/htdocs/website/ych" ServerName h5.anowl.net </VirtualHost> C/Windows/System32/etc/hosts ...

2019-06-25 21:35:56 493

转载移动端touch滑动事件

var startx, starty; 获得角度 function getAngle(angx, angy) { return Math.atan2(angy, angx) * 180 / Math.PI; }; ### 根据起点终点返回方向 1向上 2向下 3向左 4向右 0未滑动 function getDirection(startx, starty, endx, endy) {...

2019-06-24 22:33:58 387

原创时间以书面年月日显示

开始时间 let start_at = this.spu.affiliate.start_at.split(" ")[0]; //分割时分秒 //接收去掉月日首位为0的字符串 let startArr = []; //分割时分秒 start_...

2019-06-24 22:30:51 323

原创短信60S倒计时

60s倒计时实现逻辑 var countdown = 60; //定义参数赋予初始秒数 function setTime() { if (countdown == 0) { //如果时间为0 $_("btn").disabled = false; ...

2019-06-24 22:29:02 273

原创 Swiper单图显示多图轮播

banner图 if(spu.banner_url.indexOf(",") == -1){ //当多图为空就显示单图 imgstr += <img src=${h5Url+spu.banner_url} alt=""> } else { var bannerImg = spu.banner_url.split(","); for (var i = 0;...

2019-06-24 22:26:27 1355

原创 Vue table切换

动态渲染className :class="{active : isActive == 0}" :class="{active : isActive == 1}" :class="{active : isActive == 2}" :class="{active : isActive == 3}" v-show显示隐藏切换 v-show = "nowIndex == 0" v-show = ...

2019-06-24 22:24:11 1151

原创 localStorage储存

localStorage保存token if(!window.localStorage){ alert("浏览器不支持localstorage"); }else{ var storage = window.localStorage; var token = storage.getItem("auth_token"); var id = storage.getItem...

2019-06-24 22:18:56 400

原创 JS路由传参传对象及中文字符

var str = JSON.stringify(strAddrs); //对象转为字符串 str = "../position.html?strAddrs="+str; //路由拼接 str = encodeURI(str); //encodeURI()是Javascri...

2019-06-24 22:16:57 1799

原创 js复制功能

HTML <div class="userTitle"> <h1 id="userName">油菜花花匠</h1> <p>邀请码：<span id="code">8975341</span><i onclick="copyText()">复制</i></p> &...

2019-06-24 22:14:04 168

原创 form表单提交，组装数据

获取答案 var msg = $("#formData").serializeArray(); for (var i=0;i<msg.length;i++){ //为对象动态添加属性 msg.forEach(function(item){ let quesName = item.name.split(...

2019-06-24 22:10:33 1058

原创 markdown语法

一、标题 # 这是一级标题 ## 这是二级标题 ### 这是三级标题 #### 这是四级标题 ##### 这是五级标题 ###### 这是六级标题二、字体 **这是加粗的文字** *这是倾斜的文字*` ***这是斜体加粗的文字*** ~~这是加删除线的文字~~ 三、引用在引用的文字前加>即可。引用也可以嵌套，如加两个>>三个>>> 这是引用的内容 ...

2019-06-24 22:08:42 176

原创 CSS文本溢出显示省略号

overflow:hidden; text-overflow:ellipsis; white-space:nowrap 移动端浏览器绝大部分是WebKit内核的，所以该方法适用于移动端； -webkit-line-clamp 用来限制在一个块元素显示的文本的行数,这是一个不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。 d...

2019-06-23 22:07:16 188

原创手撸团购上传多张头图功能

因为是手撸BUG颇多，经过反复修改才得以完善以下功能演示初始化选择头图只有一张不会有删除按钮头图banner跟随第一张改变而改变上传第二张出现删除按钮，一次能上传五张，采用flex布局平分间距 html代码  <form id="bannerFom"> ...

2019-06-23 22:04:58 575

原创微信用户授权

本地localStorage保存openid // localStorage保存token if(!window.localStorage){ alert("浏览器不支持localstorage"); }else{ var storage = window.localStorage; var openId = storage.getItem("opd") ...

2019-06-23 21:46:58 298

原创移动端共用提示语

封装getCommonTips方法参数传入提示文字，自适应提示框根据提示文字，自适应居中显示定时器 2S后清除此提示相关代码遇见难点：多次点击，多次触发函数，重复出现提示语，影响用户体验解决办法：每次点击移除getCommonTips方法，点击无反应，2S后给onclick添加getCommonTips方法，再次传入提示文字 function getCommonTips(text)...

2019-06-23 21:42:06 674

原创 H5自动加载音乐，点击暂停、播放

html代码 <div id="btn"> <audio id="audio-player" ref="audio" preload="preload" autoplay="autoplay" loop="loop"> <source src="../../mp3/kwgr11.mp3" type="audio/mpeg...

2019-06-23 21:31:48 3040

原创微信jssdk分享功能

//普通分享 // showHide=1 分享 // showHide=2 禁用分享 var wechatshare = function (localUrl,title,desc,linkUrl,imgUrl,showHide=1) { var localUrl = localUrl; var title = title; var desc = desc; var linkUrl =...

2019-06-23 21:24:02 932

原创封装微信支付和微信二维码扫码支付

//用户信息收集弹框 function funTips(title,content,targetUrl,img,targetTip) { var str =’’; str += <div class="popover_box"> <div class="popover"> <div class="popover_img"> <img src="${img}...

2019-06-23 21:20:49 476

原创时间转换成年月日显示（去掉日月首位0）

let start_at = 2019-07-04 14:00:00 let start_at = start_at.split(" “)[0]; //分割时分秒 2019-07-04 //接收去掉月日首位为0的字符串 let startArr = []; start_at = start_at.split(”-"); //年月日分开[...

2019-06-15 11:18:39 2464

原创 js冒泡排序，取最小，或最大值

let arr = Object.keys(sku); //sku对象转化数组拿到对象长度 let arrSKU = []; //存放sku的拼团价格的数组 let listNum=null; //数组比较大小...

2019-06-10 10:56:47 861

转载 textarea 输入框限制字数（完美兼容）

在input标签中，只需要设置maxlength=”***”即可，但是在textarea标签中，IE9及IE9以下浏览器是不支持的，IE10、IE11则支持，估计后续的版本应该都会支持。现在来说下怎么让大部分IE版本都支持textarea 标签限制字数。 <;textarea id=“taContent” rows=“3” maxlength=“20” οnchange=“this.va...

2019-05-16 09:27:24 7705

转载 JQ获取节点

1、jquery 获取元素(父节点,子节点,兄弟节点) $("#test1").parent(); // 父节点 $("#test1").parents(); // 全部父节点 $("#test1").parents(".mui-content"); $("#test").children(); // 全部子节点 $("#test").children("#test1"); $("#test")....

2019-05-11 23:27:18 2951

原创验证手机号正则

var phone_reg = /1[3,4,5,7,8][0-9]{9}$/; //验证手机号正则 if(phone_reg.test(phone)){ 通过 }else{ 未通过 } 1 ↩︎

2019-05-11 23:26:23 178

原创手撸轮播

var left1 = 0; var left2 = 1380; function func() { left1 -= 690; left2 -= 690; $(“flbanner1”).style.left = left1 + “px”; $(“flbanner2”).style.left = left2 + “px”; if (left1 <= -1380){ left1 = 1380;...

2019-05-11 23:25:01 3298

转载 js.判断数据类型方法

判断js中的数据类型有一下几种方法：typeof、instanceof、 constructor、 prototype、 $.type()/jquery.type(), 接下来主要比较一下这几种方法的异同。 1、最常见的判断方法：typeof alert(typeof a) ------------> string alert(typeof b) ------------> n...

2019-05-11 23:22:44 157

原创 CSS文本溢出显示省略号

写入对应标签CSS overflow:hidden; text-overflow:ellipsis; white-space:nowrap 移动端浏览器绝大部分是WebKit内核的，所以该方法适用于移动端； -webkit-line-clamp 用来限制在一个块元素显示的文本的行数,这是一个不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。 ...

2019-05-11 23:21:27 135

原创纯JS上传图片功能心得

第一步传给后台接口转化显示格式先var str 拼接字符串（全局）再插入html里上代码 str += <li><img src = ${file} alt=""><i></i></li>; $("#ulImg").html(str); //点击删除，删除父级一行 $(’#ulImg li i’).click(function () ...

2019-03-23 23:18:23 729

转载 var和let/const的区别

let和const是 ES6 新增的命令，用于声明变量，这两个命令跟 ES5 的var有许多不同，并且let和const也有一些细微的不同，在认真阅读了阮一峰老师的文档后，发现还是有一些不知道的细节,重新整理了一下，分享给各位. 内容： var和let/const的区别块级作用域不存在变量提升暂时性死区不可重复声明 let、const声明的全局变量不会挂在顶层对象下面 const命令两个...

2019-01-15 15:08:23 508

原创 cookies,sessionStorage和localStorage的区别

联系： sessionStorage和localStorage一样，都是用来缓存客户端缓存信息。他们都只能存储字符串类型对象。区别： localStorage的生命周期是永久的，除非用户主动清除浏览器UI上存储的localStorage信息，否则它将永久存在。 sessionStorage的生命周期是存在于标签页或窗口，用于本地存储一个会话（session）中的数据，这些数据随着窗口或标签页的...

2018-11-28 22:44:52 187

原创介绍浏览器的内核

介绍一下对浏览器内核的理解主要分成两个部分：渲染引擎(Render Engine)和JS引擎。渲染引擎：负责取得网页的内容(html,xml和图像等)，整理讯息(例如假如css)，以及计算网页的显示方式，然后输出到显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不同。所有网页浏览器、电子邮件客户端以及它需要编辑、显示网络内容的应用程序都需要内核。 JS引擎：解...

2018-11-28 22:16:43 228

原创清除浮动方法

浮动对页面的影响：如果一个父盒子中有一个子盒子，并且父盒子没有设置高，子盒子在父盒子中进行了浮动，那么将来父盒子的高度为0.由于父盒子的高度为0，下面的元素会自动补位，所以这个时候要进行浮动的清除。关于清除浮动的方式: 方式一:使用overflow属性来清除浮动 .ovh{ overflow:hidden; } 先找到浮动盒子的父元素，再在父元素中添加一个属性：overflow:hidden...

2018-11-28 22:11:33 498

原创 HTML行内元素、块状元素、行内块元素的区别，行内块元素在IE8-的兼容性

HTML可以将元素分类方式分为行内元素、块状元素和行内块状元素三种。首先需要说明的是，这三者是可以互相转换的，使用display属性能够将三者任意转换：　　(1)display:inline;转换为行内元素　　(2)display:block;转换为块状元素　　(3)display:inline-block;转换为行内块状元素 1.行内元素　　行内元素最常使用的就是span，其...

2018-11-28 21:54:53 687

空空如也

空空如也