Javascript

分类下相关文章

使用 fiddler5 替换线上生产环境的 JS 文件,方便调试

晚上回家想继续调试白天没有调完的管理后台 JS Bug,但是又懒得重新搭建一套后台开发环境。 于是想起之前使用的 fiddler,替换线上环境的 JS 文件为本地文件即可。 发现当年使用的 fiddler2 已经升级到了 fiddler5。 我在 Windows 10 上使用 fiddler 始终无法启动 Chrome,干脆换成了 Edge,发现兼容性还不错。 ...

阅读全文...

JS 的省市区三级联动选择组件

由于后台要与小程序前端的城市选择对应起来,所以需要实现一个 JS 的后台省市区三级联动选择组件。 方案一:基于 element-china-area-data 的实现 https://github.com/Plortinus/element-china-area-data element-china-area-data 是基于 Vue 的 element ui 的一个实现。效果如图: 注意,github 里只介绍了基于 npm 的实现,如果想使用 CDN 引入的方式实现。 可以参考: <link rel="stylesheet" href="https:/ ...

阅读全文...

ES6 三个点新语法:数组元素的 rest / spread ,与对象属性的 rest / spread

今天在看微信小程序 zanui 的 field 组件代码时,发现一个新的语法,即三个点: <template is="zan-field" data="{{ ...config.base.name, value }}"></template> 其中的 config.base.name 是个对象,类似于 name: { focus: true, title: '收货人', placeholder: '名字' } 如果不加这三个点就会报错 Bad attr `data` with message & ...

阅读全文...

javascript 正则解析选择题答案

在做题库录入后台的 vuejs 组件。 一个一个录入答案确实费劲,如果能将几个答案一起粘贴过来,自动解析成独立的答案分别自动录入就爽多了。。。 下面的实现,支持带英文句点、中文逗号、以及没有间隔符的情况。 var str2 = new_value.replace(/^(.*)(A[\.\u3001]*\s*)/,'') // 去掉 A 选项前的内容 var choices = str2.split(/[A-G][\.\u3001]*\s*/); // 按选项分割 \u3001 是中文顿号的 unicode. ...

阅读全文...

Grunt.js Warning: Path must be a string

Github 上找了个 Chrome 插件进行修改,但是运行 grunt 命令之后报错 Running "jshint:files" (jshint) task Warning: Path must be a string. Received null Use --force to continue. Aborted d ...

阅读全文...

百度统计的自定义上报功能 - 事件分析

在页面引入百度统计的代码之后,对于页面上需要统计的事件,可以加入自定义统计。 例如,点击了某个按钮,完成了某个流程,等等 _hmt.push([‘_trackEvent’, category, action, opt_label, opt_value]); 具体参数,参考百度统计文档 http://tongji.baidu.com/web/help/article?id=236&type=0 举例说明,统计页面上的打赏按钮的点击量 var title = document.getElementsByTagName("title")[0].innerHTML; _h ...

阅读全文...

避免三方 js 文件被重复加载

问题 想在 web 统一模板中引入 jquery 和 vuejs,但是部分页面之前已经引入了。 如果想引入这两个库,但是又不影响已存在的页面使用。例如,对 ajax 请求统一修改了 header 加入了 csrf token, 但是如果再次引入 jquery, 就会导致配置被重置。 思路 判断一个库是否已经引入,如果引入了,就不再引入。 实现 <script> if (condition) { document.write('<script src=\"https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js\&q ...

阅读全文...

ES6 的箭头函数,让 let that = this 去死吧

调试小程序的时候,发现清空本地全部数据缓存之后,报错 thirdScriptError this.login is not a function;at App onShow function;at api refreshSession fail callback function TypeError: this.login is not a function at Function.fail (http://127.0.0.1:9973/appservice/app.js:31:14) at Object.fail ( 第一眼愣是没发现问题,仔细一看 at api refre ...

阅读全文...

ES6 函数参数的 destructuring

在 weex 中使用 vuex 的 actions 时,发现了 ES6 的一种新语法 export function FETCH_USER ({ commit, state }, { id }) { return state.users[id] ? Promise.resolve(state.users[id]) : fetchUser(id).then(user => commit('SET_USER', { user })) } 之前从未见过函数可以这样定义, 参数居然都是 object。查了一下,发现是 ES6 的新特性 函数参数 destructuring ...

阅读全文...

ES6 中 let, var, const 的区别

const 首先测试一下 const > const framework = "weex"; > framework = "react native"; TypeError: Assignment to constant variable. > const weex = {"weexpack": "good", "weex-toolkit": "sucks"}; > weex["weex-toolkit"] = "good ...

阅读全文...

CoffeeScript

Wiki https://github.com/jashkenas/coffee-script/wiki Help $ coffee -h sleep delay = (ms, func) -> setTimeout func, ms $(document).ready -> delay 1000, -> alert "Hello world!" 函数的定义及调用需要注意的地方 调用时,括号可有可无。但是为了方便阅读,还是加上为好 函数中的最后一行默认为 return 的值。为了方便阅读,还是显式的加上为好 函数的定义可以采用一行流。为了阅 ...

阅读全文...

wordpress 报错 TypeError: $ is not a function

代码非常简单,第一行就报错了 $(document).ready(function() { // Code }); TypeError: $ is not a function 估计是 $ 冲突了,果然,修改成下面的代码即可 jQuery(document).ready(function($) { // Code }); This is because WordPress may use $ for something other than jQuery, in the future, or now, and so you need to load jQuery in a w ...

阅读全文...

网页上使用 js 调用打印机

如果直接调用 window.print(); 会默认打印当前页面。 但是,我想打印指定的页面内容,即,指定的 div 内的内容 stackoverflow 上找到一个解决方案,这段 CSS 的逻辑就是在打印机页面上将其他内容隐藏,只显示需要打印的部分 @media print { body * { visibility: hidden; } /* 隐藏 chrome 浏览器下的 header, footer */ @page { margin: 0; } #section-to-print, #section-to-print * { visibility: ...

阅读全文...

使用 local storage 存储页面产生的数据结果

今天在做年会的抽奖程序, 因为担心酒店现场的网络不稳定,所以搞了个离线版。为了防止关闭浏览器造成的抽奖结果丢失,所以想使用 local storage 存储结果。这样即使意外导致页面关闭,重新打开之后依旧可以继续进行。 cookie 与 local storage 存储的区别 Cookie 是方便服务端读取,因为每次前端向后台发起请求都会带上本地的所有 cookie。 而 local storage 仅仅限于浏览器端读取。 Cookie 有 4096 个字节的大小限制,而 local storage 的限制则为 10M 每个域名。 Cookie 可以设置过期时限,而 local storage ...

阅读全文...

微信网页分享朋友圈失败的迷之异常

在实现一个将微信网页分享到朋友圈的功能,偷懒在后台 Laravel 模板中嵌入了 js 代码,而且使用模板变量给 js 变量传值。 var desc = "{{ $post->content }}".slice(0, 50); 于是,迷之异常诞生了! 由于是在需要用户授权认证的微信网页里,打了几个 alert 也没找到问题的根源,但是知道一定是这一行报错了。 没办法,在 Ubuntu 上没有调试客户端的支持,只能把需要用户授权的逻辑一行一行地注释掉了,在 PC Chrome 里看具体异常 Uncaught SyntaxError: Invalid or unex ...

阅读全文...