javascript
beyond__devil
这个作者很懒,什么都没留下…
展开
-
今天js群里,有人问一个函数,闲着没事,自己就写了写
问题: “求教个js问题 我有个数组 长度不固定 例如[1,2,3,4,5,6,7,8,9] 但是现在我有个需求 需要把上面的数组按照固定间隔分成N个数组 假如每间隔3个 得到的应该是[1,4,7] [2,5,8] [3,6,9] 这个js该怎么写哈”献丑,自己随便想了想,写的丑陋,各位可以随便看看: var arr = [1,2,3,4,5,6原创 2016-09-30 10:11:31 · 459 阅读 · 0 评论 -
input[file]为空,ios手机,ajax上传表单失败,404,408 错误码
项目中,目前都尽量采用 ajax 上传表单,然后根据返回值进行提示,感觉用户体验好点。最近出现一个问题: 苹果部分型号的手机,在微信中,完善个人信息页面,ajax上传表单时,未选择头像,出现失败问题。 查看 nginx 返回 408、400 的错误,ajax 进入 error 回调。碰到这种兼容性问题,真的很纠结,查看了各种资料,最终找到了解决方案。原因是:safari 浏览器部...原创 2018-09-11 15:23:08 · 1717 阅读 · 0 评论 -
javascript 识别客户端唯一性
项目中想统计页面的点击次数、浏览人数等,类似百度统计吧,但是很简单,就很随意的功能。实现思路打算: 前端页面,ajax 直接传递一些相关参数,记录到 mysql 中,然后后台分析... mysql 字段: id user_id - 如果用户登录,顺带记录下 uid unique_id - 唯一标识 path - 访问页面路径 user_agent - 记录用户的完成...原创 2018-10-06 09:47:19 · 11852 阅读 · 2 评论 -
javascript-browserslist-在不同的前端工具间共享目标浏览器
javascript browserslist - 在不同的前端工具(Autoprefixer, Stylelint, babel-preset-env)之间共享目标浏览器。github地址: https://github.com/browserslist/browserslist官网: https://twitter.com/browserslist浏览器检测网站: http...原创 2018-10-08 15:12:21 · 2889 阅读 · 0 评论 -
mui picker 非级联选择器
MUI 提供的 picker(选择器),默认支持了单个、多个。但对于多个,只能是 "级联"。项目中有需求,类似年龄段的选择:18-30,不是级联,所以就看了下源码改造了下:找到 mui.poppicker.js,init() 函数最后,添加一个新选项:noLink,代表 '是否非联动'(大概:82行) // 1.是否非联动 self.noLink = self.options...原创 2018-10-30 14:52:12 · 938 阅读 · 1 评论 -
laravel mix 笔记
github地址: https://github.com/JeffreyWay/laravel-mix官网: https://laravel-mix.com/中文文档: https://segmentfault.com/a/1190000015049847对于 laravel-mix,我们只需要知道,它是位于 webpack 顶层的一个配置层,使用它会让我们的操作变得非常简单,...原创 2018-11-06 17:34:49 · 1559 阅读 · 0 评论 -
mui picker 的 setSelectedValue 设置多个选择框默认值,不生效
使用 mui 的城市级联,设置默认值,发现 setSelectedValue() 无效,只是省份有效!使用 setSelectedIndex() 可以,但 setSelectedValue() 无效。一度让我怀疑自己使用错误!这么严重的 bug,官方居然不管,很是火大!搜索一看,应该是问题老早就存在了!解决方法,搜索到 2 篇文章: https://github.com/dcloudi...原创 2018-11-26 14:13:08 · 2722 阅读 · 0 评论 -
mui picker 非级联弹层
MUI 提供的 picker(选择器),默认支持了单个、多个。但对于多个,只能是 "级联"。项目中有需求,类似年龄段的选择:18-30,不是级联,所以就看了下源码改造了下:找到 mui.poppicker.js,init() 函数最后,添加一个新选项:noLink,代表 '是否非联动'(大概:82行) // 1.是否非联动 self.noLink = self.options...原创 2018-11-26 14:13:53 · 320 阅读 · 0 评论 -
webpack 构建时,出现 autoprefixer 过期语法的错误解决
webpack 构建时,css 报错: Gradient has outdated direction syntax. New syntax is like "to left" instead of "right"解决方法: 这个是 gradient 语法过期的错误。我们定位到报错的地方: 将 right 替换为 to left 有时候我们是 top,替换为 to bottom...原创 2018-11-26 14:14:37 · 1563 阅读 · 0 评论 -
qrcode.js 插件在 webpack 中的 _android 错误解决
前端生成二维码时,使用的 qrcode.js 插件在 webpack 中报错: _android not work Cannot read property '_android' of undefine解决方法: https://github.com/davidshimjs/qrcodejs/issues/148 https://github.com/davidshimjs/qr...原创 2018-11-26 14:15:24 · 2449 阅读 · 1 评论 -
使用node将HTML生成PDF或图片:采用 puppeteer
github 地址: https://github.com/GoogleChrome/puppeteer文档地址: https://pptr.dev/中文文档地址: https://zhaoqize.github.io/puppeteer-api-zh_CN/#/简单说下这个东西是啥: Puppeteer 是一个 Node 库,它提供了一个高级 API 来通过 DevToo...原创 2018-11-30 16:53:35 · 2892 阅读 · 0 评论 -
文件下载
文件下载,在我们的项目中,基本都会用到,记得写过好多次了,但每次写,只有个大概印象,又需要重新找。今天项目中,涉及到了 "多图下载",点击按钮,同时下载多张图片。好好总结下下载,避免以后每次要写了,需要来回找资料!1.前端下载 我们可以直接通过 <a> 来下载文件 <a href="downloads/test.jpg">下载 .jpg 图片</a>...原创 2018-12-03 18:02:41 · 222 阅读 · 0 评论 -
nrm 切换 npm 源
npm 配置仓库 查看当前仓库配置: npm config list // 查看配置 npm config ls -l // 查看详细配置 可以看到 registry 配置,就是仓库地址 简述修改配置的 3 种方式: 1.通过 config 配置 npm config set registry https://registry.npm.taobao.org...原创 2019-01-15 09:38:15 · 370 阅读 · 0 评论 -
将 vue 路由拆分到多个文件( vue-router 目录结构)
对于稍微复杂点的项目,我们定义的路由文件,会越来越大,而且所有路由都混在一个页面,看着也很混乱,不清晰。所以,想把 vue 路由也按功能,类似 laralel 一样,划分为多个路由文件,最终的路由结构类似下面: routes/ index.js account.js student.js business.js ... 也可以是更深层次的嵌套 school/...原创 2019-03-14 20:27:10 · 7994 阅读 · 0 评论 -
更标准的 vue 目录结构
想重构下 Vue 的目录结构,希望更标准点,以后项目开发,都可以有一个大概的标准。搜索了几篇文章: https://forum.vuejs.org/t/vue/45718 // 国人写的这篇好像很不错 https://github.com/JasonBai007/vue-seed // 里面提到的这个 https://linjinze999.github.io/vue-llplat...原创 2019-03-11 07:04:01 · 2096 阅读 · 0 评论 -
VueJs 引入百度地图报错: BMap is undefined
Vue 项目中引入百度地图,想采用动态加载的方式,因为无需在每个页面统一引入。考虑到加载问题,将动态加载代码放入到 created() 生命周期方法中: let scriptNode = document.createElement('script'); scriptNode.src = '//api.map.baidu.com/api?v=2.0&a...原创 2019-03-26 09:34:39 · 4352 阅读 · 0 评论 -
javascript调用微信或QQ扫一扫
项目里为了体验做的好点,想直接通过js调用手机的扫一扫: 服务的用户主要是通过:微信或QQ 之前使用过 微信或QQ的分享 腾讯移动WEB开发平台的 '对外分享组件接口文档' http://open.mobile.qq.com/api/component/share 写的博客地址(代码在评论里贴过): http://blog.csdn.net/beyond__devil/原创 2017-12-19 15:16:03 · 4495 阅读 · 0 评论 -
javascript-html2canvas翻译
1.github地址: https://github.com/niklasvh/html2canvas2.官网地址: https://html2canvas.hertzen.com3.文档翻译: 1>介绍 在开始使用html2canvas之前,有必要了解它的相关内容以及局限性 1)如何工作 脚本遍历页面加载的所有DOM。收集页面所有元素的信息,之后利用获取到的元素的信息原创 2017-10-16 08:43:53 · 828 阅读 · 0 评论 -
js的navigator.geolocation的API笔记
Navigator.geolocation: 返回一个 'Geolocation' 对象 Geolocation - 获取用户设备位置。鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。同时,对于请求许可,不同浏览器有自己不同的策略和方法。 属性 - 无 方法: Geolocation.getCurrentPostion(success[, erro原创 2017-03-06 10:09:55 · 1431 阅读 · 0 评论 -
javascript-clipboard.js教程
1.介绍: clipboard.js 是javascript来复制文本到粘贴板。不需要任何依赖,使用起来很简单!2.兼容性: IE 9+, Chrome 42+, Firefox 41+, Safari 10+, Opera 29+, Edge 12+3.使用: 1>引入js文件: 2>实例化 Clipboard: new Clipboard(element) el原创 2017-05-10 18:08:26 · 1179 阅读 · 0 评论 -
jquery-countdown插件教程
1.使用: $('#clock').countdown(finalData[, callback(或options)]); finalData - 必选 options - 可选2.参数: 1>finalData - 设置倒计时的终止时间 3种格式: 1)原生的 'Date' 对象 2)毫秒格式的 '时间戳'(javascript的时间戳,单位是 '毫秒',切记!)原创 2017-04-23 15:58:25 · 10055 阅读 · 1 评论 -
javascript-qrcode.js教程
1.介绍: QRCode.js 是javascript来生成二维码。不需要任何依赖,使用起来很简单!2.兼容性: IE6~10, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows Mobile, ETC.3.使用: 1>引入js文件 2>使用方法: /* 1.最简单的使用,2个原创 2017-05-10 15:58:16 · 1145 阅读 · 0 评论 -
关于layer弹窗
layer弹窗分为:PC和WAP,引入的方式也很简单,只是数不熟练的问题,直接看官网的教程即可。layer.layui.comPC端的功能很强大,而相比于手机端,功能弱了不少,可能都需要自己来定制吧,比较麻烦。而且感觉效果也没PC端直接。项目里的手机端,使用了layer-mobile,但是感觉样式还不如pc好看,更能也少。而PC的layer,在手机端,展示貌似也没问题,所以,打算wap端全原创 2017-09-06 10:33:51 · 606 阅读 · 0 评论 -
上传图片,实现图片预览
关于图片上传的预览: 在html5之前,页面隐藏iframe和form,将图片上传到服务器(提交给了iframe,form有一个target属性),返回图片地址,展示在iframe中。 html5给我们提供了一个 'FileReader' API,可以在选择图片后,获取本地的图片文件,从而实现预览。可直接查看FileReader API文档: https://developer.m原创 2017-09-14 15:40:13 · 286 阅读 · 0 评论 -
ajax跨域,以及在laravel中实现跨域
今天有个朋友问到了laravel中ajax的跨域问题,之前看过不少,不过项目中从来没用过,基本都忘记了...为了解决问题,找了找资料,百度上到处是,这里记录2篇,感觉还不错: http://www.cnblogs.com/dojo-lzz/p/4265637.html http://blog.csdn.net/leedaning/article/details/53787008这里罗列出原创 2017-09-22 21:47:52 · 1839 阅读 · 0 评论 -
javascript-cropper插件翻译笔记
https://github.com/fengyuanchen/croppercropper使用说明 一、特性 jQuery v1.9.1以上版本支持 插件有38个options,27种methods,6种事件 支持手机端touch事件 支持缩放 支持旋转 支持翻转 支持多个croppers 支持在canvas上修剪 支持在浏览器端通过canvas修剪图片原创 2017-09-15 08:57:23 · 5194 阅读 · 1 评论 -
javascript模板引擎:art-template文档笔记
基本按照手册,过了一遍,当自己熟悉下:1.github地址: https://github.com/aui/art-template2.引入文件: lib/template-web.js 兼容IE8,还需要引入example/web-ie-compatible/*.js3.语法: 支持2种:标准语法 和 原始语法 标准语法:支持基本模板语法以及基本javascript表达式 原原创 2017-09-23 23:17:39 · 4097 阅读 · 0 评论 -
ajax跨域的响应头
可以结合上篇文章,一起看: ajax跨域以及在laravel中实现跨域。先分享几篇好的文章: http://blog.csdn.net/wangjun5159/article/details/49096445 - 解释的很清晰 https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Access-Control-Allow-Or原创 2017-09-25 10:27:19 · 594 阅读 · 0 评论 -
Access control allow origin 简单请求和复杂请求
原文地址:http://blog.csdn.net/wangjun5159/article/details/49096445错误信息:XMLHttpRequest cannot load http://web.image.myqcloud.com/photos/v2/10008653/bhpocket/0/?sign=4FcLKd5B8…p4SkFVUEJtZ1omZT转载 2017-09-25 10:28:29 · 53868 阅读 · 0 评论 -
javascript通过math.random获取随机数
项目里,想通过js来生成一个范围内的随机整数,php使用惯了,有函数提供。查看js,使用 Math.random。而只能随机0-1之间。如何实现任意范围的数呢?function randomIntFromInterval(min,max){ return Math.floor(Math.random()*(max-min+1)+min);}更好的是参考,火狐开发者文原创 2017-10-02 10:45:11 · 626 阅读 · 0 评论 -
上传base64编码图片到七牛云
1.上传base64编码图片到七牛云 参考官方提供的接口文档: https://developer.qiniu.com/kodo/kb/1326/how-to-upload-photos-to-seven-niuyun-base64-code POST的URL地址格式: http://域名/putb64/文件大小/key/"安全的" base64编码后的文件名/mimeType/原创 2017-10-27 21:36:24 · 4434 阅读 · 2 评论 -
安卓微信内,window.location.reload()不刷新问题
都开发微信好久了,一直没发现这个问题!也没注意!可能是有些安卓手机会有这个问题!在页面上,js使用 window.location.reload(),刷新无效!!!解决方法:使用window.location.href = window.location.href + 时间戳(随机hash等),使用页面跳转来搞定!但考虑到页面本身可能携带参数等,需判断 ? | & 的问题原创 2017-10-20 16:47:04 · 6129 阅读 · 0 评论 -
trumbowyg编辑器文档笔记
1.官网地址: https://alex-d.github.io/Trumbowyg2.github地址: https://github.com/Alex-D/Trumbowyg3.引入文件: 依赖jquery 头部引入css文件 4.开始(get start) 1>基础 将转换为编辑器,最简单的代码: $原创 2017-10-30 20:50:15 · 3523 阅读 · 0 评论 -
mock.js 学习笔记
上次重构 vue 目录时,有提到一个 mock 目录,是用来模拟生成 ajax 数据的。今天把这个遗留内容看下,看如何能应用到团队前端开发中:官网地址: http://mockjs.com/github 地址: https://github.com/nuysoft/Mock文档在 github 上,我们简单过一遍,安装以及使用: 1.安装: npm install mock...原创 2019-03-29 12:34:04 · 328 阅读 · 0 评论