Category: Javascript /Jquery / React / Bootstrap / Web

Javascript: 图表类, Chart.js使用总结, 数据可视化, 画折线图实例, Chart.js 快速入门, Chart.js图表的保存/下载

概述 Chart.js是一个HTML5图表库,使用canvas元素来展示各式各样的客户端图表,支持折线图、柱形图、雷达图、饼图、环形图等。在每种图表中,还包含了大量的自定义选项,包括动画展示形式。 Chart.js比较轻量(gzip版本仅4.5k),且不依赖其他库。 Chart.js官网: http://www.chartjs.org/ 使用步骤 第一步:安装 #npm: npm install chart.js --save #Bower: bower install chart.js --save #CDN: https://cdnjs.com/libraries/Chart.js chart.js源码:https://gi… Read More

Javascript: 实现复制内容到粘贴板, clipboardjs用法, 实现复制内容到剪贴板, How TO – Copy Text to Clipboard

  1. 简单方法 HTML <!-- The text field --> <input type="text" value="Hello World" id="myInput"> <!-- The button used to copy the text --> <button onclick="myFunction()">Copy text</button> JavaScript function myFunction() { /* Get the text field */ var copyText = document.getElementById("myInput"); /* Select th… Read More

Javascript: 生成颜色,颜色处理,随机生产颜色,TinyColor,随机色彩,随机色系

主页:https://github.com/bgrins/TinyColor 下载 JS :tinycolor.js TinyColor JavaScript color tooling TinyColor is a small, fast library for color manipulation and conversion in JavaScript. It allows many forms of input, while providing color conversions and other color utility functions. It has no dependencies. 用法: <script type='text/javascript… Read More

JQuery: 操作数组 each、map、grep、filter, 循环数组, 编辑数组

Jquery中对数组的操作大致有一下几种形式: 1、$.each( collection, callback(indexInArray, valueOfElement) ) $.each()函数和$(selector).each()不一样。$.each()函数可以用来遍历任何一个集合,不管是一个JavaScript对象或者是一个数组,如果是一个数组的话,回调函数每次传递一个数组的下标和这个下标所对应的数组的值(这个值也可以在函数体中通过this关键字获取,但是JavaScript通常会把this这个值当作一个对象即使他只是一个简单的字符串或者是一个数字),这个函数返回所遍历的对象,也就是这个函数的第一个参… Read More

Javascript: 程序员装X必备—19个JS简写技巧,让你写代码速度翻倍!!

代码精炼是每个有追求的程序所向往的,本文总结了19个JavaScript的简写技术,其中包括三元操作符、短路求值简写方式、声明变量简写方法等等,希望对你有帮助。 1.三元操作符当想写if…else语句时,使用三元操作符来代替。 简写: 也可以嵌套if语句: 2.短路求值简写方式当给一个变量分配另一个值时,想确定源始值不是null,undefined或空值。可以写撰写一个多重条件的if语句。 或者可以使用短路求值方法: 3.声明变量简写方法 简写 4.if存在条件简写方法 简写: 只有likeJavaScript是真值时,二者语句才相等 如果判断值不是真值,则可以这样: 简写 5.JavaScript循环简写… Read More

jQuery: 如何编写 jQuery 插件

译自 jQuery Plugins / Authoring   创建插件 看来 jQuery 你已经用得很爽了,想学习如何自己编写插件。非常好,这篇文档正适合你。用插件和方法来扩展 jQuery 非常强大,把最聪明的功能封装到插件中可以为你及团队节省大量开发时间。 开始 要编写一个 jQuery 插件,需要为 jQuery.fn 对象增加一个新的函数属性,属性名就是插件的名字 jQuery.fn.myPlugin = function() { // 插件的具体内容放在这里 }; 等一下! 我熟悉并钟爱的 $ 哪儿去了? 它还在,只是为了确保你的插件不与其它使用 $ 的库发生冲突,有一个最佳实践: 把 jQuery 传递给 IIFE(立即调用函数),并… Read More

添加holiday假日到fullcalendar ,Add Holiday Calendars to Full Calendar

如果你使用fullcalendar,添加holiday假日的方法如下: googleCalendarApiKey : 'PUT-YOUR-GOOGLE-API-HERE', // google api key eventSources: [ {url:'https://www.google.com/calendar/feeds/en.usa#holiday@group.v.calendar.google.com/public/basic',cache:true}, // us holiday {url:'https://www.google.com/calendar/feeds/zh.china#holiday@grou… Read More

改造FullCalendar增加节气、节日和农历显示, add lunar for FullCalendar

网上看了FeiFei些的《fullCalendar改造计划之带农历节气节假日的万年历》文章,按照他的方法改造发现他用的是老版本的插件,新版本代码结构变动很大,无奈自己重新读源码改造之,记录下来,给有需求的朋友一点参考。 FullCalendar官网(https://fullcalendar.io/) 改造使用新的版本,v 3.0.1。 首先看下改造成功后的预览图吧: 一、汉化 现在插件已经自带了本地化文件,所以直接加载插件包中的locale/zh-cn/js即可。 二、增加农历,节气,节假日显示 关于直接调用Google Calendar的订阅我就不说了,墙的厉害。 下面说说直接修改源文件,这个就麻烦点,不过自定… Read More

创建Google API Key, Creating a Google API Key

To read events from your public Google Calendars you’ll need create a Google API key and save within your plugin settings. Here are step-by-step instructions to create and save a Google API key: 1Navigate to the Google Developers Console. 2 From the top Project menu select Create project. 3Give your project a name, agree to the terms, then click Create. 4…

JQuery: 提交表单数据,转换表单数据为json,values of Form to Json (jquery.serializeJSON)

项目:https://github.com/marioizquierdo/jquery.serializeJSON 下载:jquery.serializeJSON-master jquery.serializeJSON 前端在处理含有大量数据提交的表单时,除了使用Form直接提交刷新页面之外,经常碰到的需求是收集表单信息成数据对象,Ajax提交。 而在处理复杂的表单时,需要一个一个区手动判断处理字段值,显得非常麻烦。接下来介绍的插件将解决这个问题。 使用jquery.serializeJSON,可以在基于jQuery或者Zepto的页面中,调用 .serializeJSON() 方法来序列化form表单… Read More