研究背景：网站中如果图片过多，就会因为加载图片而等待很长时间，此时我们就用到图片延时加载插件jquery.lazyload.js，这个插件可以让我们在向下滚动的时候加载图片。让网页首屏尽可能快的加载进来。如何使用jquery.lazyload.js：1、jquery.lazyload.js依赖于jquery.请将下列代码加入HTML的结尾，也就是
前言：表单验证是十分常见的需求。公司做运维系统需要大量的编辑/新增表单，编辑之后提交，提交前需要进行表单验证，验证成功才能发起POST请求。由于项目前端大部分是基于Bootstrap开发的，可看官网BootstrapValidatorhttp://1000hz.github.io/bootstrap-validator/，感觉比较容易上手。用bootstrapvalidator有个问题，需验证的input/select等标签的外部需要有一个
jQuery
2017-08-15 发布
使用方法，可以在官网中搜索需要的插件或者在VsCode的“”扩展“”中搜索需要的插件添加方法使用Ctrl+P,输入extinstallxxxx，搜索要安装的插件，点击安装按钮即可（各取所需插件）extinstallHTMLSnippets超级使用且初级的H5代码片段以及提示extinstallHTMLCSSSupport让HTML标签上写class智能提示当前项目所支持的样式extinstallDebuggerforChrome让vscode映射chrome的debug功能，静态页面都可以用vscode来打断点调试、配饰稍微复杂一点extinstalljQueryCodeSnippetsjquery提示工具extinstallPathIntellisense自动路径补全、默认不带这个功能extinstallNpm
长阴影设计是平面设计的一个变体，添加了阴影，产生了深度的幻觉，并导致了三维的设计。在本教程中，我们将创建一个jQuery插件，通过添加完全可自定义的长阴影图标，我们可以轻松地转换平面图标。戳我查看效果图在本节教程中，我们将介绍长阴影设计的元素，我们将创建一个简单的jQuery插件，让我们来设计这些元素。让我们开始吧！长阴影元素设计设计是什么？我们将把这个元素分离为不同的部分，以此组成一个完整的长阴影设计：主要元素，或元素投射阴影。阴影长度通常很长，因此给出了效果的名称。阴影长度也给出了主要元素具有深度的幻觉。阴影方向或角度。在现实世界中，这取决于光源的位置。通常，光源投射的所有阴影都有相同的方向。阴影颜色和不透明度。光源颜色影响阴影的颜色。而且，光源越强，阴影越黑暗。这些元素叠加在一起构成了3D立体效果。创建长阴影jQuery插件要创建jQuery长阴影插件，我们将设置一个基本的jQuery插件项目结构，如下所示：创建一个文件夹来保存项目文件。我们可以为这个文件夹取名为long-shadows-jquery-p
最近一直在给公司做各种控件，一开始设计控件的时候，老板要求尽量使用简单，最好是开发人员调用一个方法，控件就可以自动生成。所以在控件设计上，都是基于jquery插件的写法，并把所有的事件都封装到内部，然而随着控件越来越多，应用场景越来越广泛，发现这么设计有很大的弊端，比如：不管什么页面，想要用到控件，要把所有的控件js都加载进来（js是经过压缩的）如下图，由于每个控件耦合度较高，在多个控件组合使用时，代码组织起来相当麻烦。使用上的麻烦，维护上的困难，再加上性能问题，导致不得不对其进行重构。重构思路：基于模块化开发，用reuqirejs进行管理，把每个控件都做成模块化，页面上要使用时，单独的去引用某个模块就可以。多个控件如果要组合使用，以及和页面上的元素做交互的话，在控件名对应的extra.js中去做处理。下面就是贴代码时间（由于公司有保密规定，这里不方便把整个代码打包和大家分享，只能展示部分代码）：1、工程目录：2、ProvinceAndCity.js省份城市多选控件代码/***@author:tengri*
2.5操作数据类型和变量在一个变量中存储数值或字符串这样的特定信息，通常只是程序中的第一步。大多数程序还操作数据以得到新的结果。例如，为分数增加一个数值以加分，把订购的商品的数目乘上商品的价格得到一个总金额，或者在一条通用性的消息末尾添加一个名字来把它个性化，例如，得到“Goodtoseeyouagain,Igor”。JavaScript提供了各种操作符来修改数据。操作符只是一个符号或单词，用来把一个或多个值修改为其他的值。例如，可以使用+符号（加法操作符）把数值相加。对于不同的数据类型，有不同类型的操作符。2.5.1基本算术JavaScript支持基本的算术运算，例如加法、除法、减法等。表2-2展示了基本的算术操作符及其使用方法。你可能习惯了使用一个×表示乘法（例如4×5），但是在JavaScript中，使用*符号把两个数相乘。也可以在算术运算中使用变量。既然变量只是数值或字符串这样的值的一个容器，使用变量就等同于使用变量的内容。varprice=10;varitemsOrdered=1
拷贝即复制。本文只讨论js中复杂数据类型的复制问题（Object,Array等），不讨论基本数据类型（null,undefined,string,number和boolean），这些类型的值本身就存储在栈内存中(string类型的实际值还是存储在堆内存中的，但是js把string当做基本类型来处理)，不存在引用值的情况。浅复制和深复制都可在已有对象的基础上再生一份，但对象的实例存储在堆内存中然后通过一个引用值去操作对象，由此复制的时候就存在两种情况了：复制引用和复制实例，这也是浅复制和深复制的区别所在。浅复制：浅复制是复制引用，复制后的引用都是指向同一个对象的实例，彼此之间的操作会互相影响。深复制：深复制不是简单的复制引用，而是在堆中重新分配内存，并且把源对象实例的所有属性都进行新建复制，以保证深复制的对象的引用不包含任何原有对象或对象上的任何对象，复制后的对象与原来的对象是完全隔离的。浅复制：浅复制就是简单的引用复制，示例如下：varsrc={name:"src";}vartarget=src;//复制一份src
前言：学习layer弹出框，之前项目是用bootstrap模态框，后来改用layer弹出框，在文章的后面，我会分享项目的一些代码(我自己写的)。layer至今仍作为layui的代表作，她的受众广泛并非偶然，而是这五年多的坚持，不断完善和维护、不断建设和提升社区服务，使得猿们纷纷自发传播，乃至于成为今天的Layui最强劲的源动力。目前，layer已成为国内最多人使用的web弹层组件，GitHub自然Stars3000+，官网累计下载量达30w+，大概有20万Web平台正在使用layer。具体请移步layer官网，http://www.layui.com/doc/modules/layer.html这篇博客会引用官网的一些内容，主要是写写layer的一些难点。比如如何用layer打开一个新的网页，content直接为一个网址就可以了，但是在你的项目中，这个网址又是啥??HTML的直接路径?相对路径??都不是!!layer如何获取父界面的元素，比如我点击新增按钮，在layer框编辑后提交，是如何关
一、jQuery介绍jQuery是一个轻量级的js库（一万多行代码），把一些复杂的功能用方法封装起来，实现快速开发jQuery是建立在js基础上的，jQuery能实现的功能，js一定都能实现，但是js能实现的功能，jQuery不一定能实现。jQuery的语法就一句：$(selector).action（）首先我们要从官网下载jQuery下载好之后
本博客介绍基于SpringData这款orm框架加上Jquery.pagination插件实现的分页功能。介绍一下SpringData框架springData:Spring的一个子项目。用于简化数据库访问，支持NoSQL和关系数据存储。下面给出SpringData项目所支持NoSQL存储：*MongoDB（文档数据库）*Neo4j（图形数据库）*Redis（键/值存储）*Hbase（列族数据库）SpringData项目所支持的关系数据存储技术：*JDBC*JPAJPASpringData:致力于减少数据访问层(DAO)的开发量。开发者只要写好持久层接口就好，然后其它的框架会帮程序员实现。开发步骤：【SpringData实现数据获取】本项目是采用maven的，所以可以参考一下我的maven配置：
下拉分页选择插件SelectPagev2.2发布了，插件更新内容：增加为原始输入框的value属性设置初始化值，以初始化插件选中项目修复多选模式下关闭标签出错的问题修复输入查询关键字后失去焦点，再次获得焦点时，插件没有根据已存在的关键进行过滤增加inputDelay配置项目，设置ajax数据源模式下，延迟输入查询的时间，避免在单位时间内连续输入发起的连续ajax查询，单位：秒，默认值：0.5修正对数字类型的列进行排序时，仍然以字符串的方式进行排序插件功能介绍：多功能下拉选择插件SelectPage功能特点基于jQuery、Bootstrap2、3开发输入框输入关键字快速查找（autocomplete）结果列表分页展示使用键盘快速操作基本功能及分页功能允许使用静态json数据源或ajax动态请求的数据源多项选择以标签（Tag）形式展现结果列表自动判断屏幕边缘，避免内容超出可视范围丰富的参数设置及功能API调用浏览器兼容：IE8+、Chrome、Firefox等插件基于jQ
话不多说，先看效果。其实就是一个可以按住鼠标进行一个区域内条目选择的功能，相信用过JqueryUI的都知道这是selectable的功能，然而我们如果用Vue开发的话没有类似的插件，当然你仍然可以把jquery的拿过来直接用，但是我又不想引入jquery和jqueryUI在我的项目中，于是我就自己尝试着实现类似的功能。要实现这个功能分两步。第一步是实现鼠标选择区域的功能，第步部是把这个区域内被选择的item添加一个active的类。先看如何实现按住鼠标画虚线框，思路是先把容器元素的定位改为relative然后判断当鼠标按下（mousedown）的时候，进行记住这个点击点的位置（e.layerX,e.layerY），然后鼠标移动（mousemove）的时候，实时的监测鼠标的位置（e.layerX,e.layerY），有了这两个位置就可以动态的创建一个div,它的定位为absolute,然后把它添加的容器框里，并且每次清空前一个框就可以了。为什么是用e.layerXe.layerY呢，layerXlayer
前面的话Velocity是一款优秀的JS动画库，完全可以作为jQuery的animate的替代品。需要动画功能时，使用Velocity是一个好选择。本文将详细介绍Velocity.js的使用概述Velocity是一个简单易用、高性能、功能丰富的轻量级JS动画库。它和jQuery的animate()有相同的API，但它不依赖jQuery，可单独使用。Velocity不仅包含了$.animate()的全部功能，还拥有：颜色动画、转换动画(transforms)、循环、缓动、SVG动画和滚动动画等特色功能。它比$.animate()更快更流畅，性能甚至高于CSS3animation，是jQuery和CSS3transition的最佳组合，它支持所有现代浏览器，最低可兼容到IE8和Android2.3【下载】可以通过官网直接下载Velocity.js，下载地址也可以使用npm安装npminstallvelocity-animate基本用法当使用jQuery时，Velocity和jQuery的ani
前言目前公司主站以及老的KMS页面采用的是JQ+ES6,而新版KMS则是由Vue开发的。使用Vue开发更加高效，优雅。但是从JQuery转到Vue其实有个过程，我在开发前自认为对Vue还是挺了解的，但是真正动手起来发现还是有一些不适应。因此在此写下一些心得，记录下来。思维方式差异JQuery对于JQ大家肯定都非常熟悉，使用JQ开发，就像把大象装进冰箱：拿到DOM元素封装功能函数操作DOM这种思维很直观，拿到元素，然后就可以"为所欲为"。但是在页面复杂程度越来越高的情况，许多代码无法复用，代码维护成本高，缺少规范。JQ组件化在业务功能，业务场景越变越多的情况下，为了提高开发效率，前端组件化势在必行。于是前端组件化规范就出现了。基本思想是通过继承来将代码有效组织起来，减少一些重复的劳动，规范了组件的生命周期。优点：将原来分散的组件有机结合起来，有利于以后业务的扩展提供了完善的继承模式，很容易产出新业务的组件提供了事件机制以及全局标识符缺点：过多的继承使得组件的依赖越来越多，但是不引入依赖
今天在做练习的时候发现了一个坑。。$(function(){//定义一个数组vararr=[1,2,3,4,5];//遍历数组arr.each(function(i,item){alert(arr[i])})})我的目的是想遍历整个数组，但是，控制台报了个isnotafunction；然后，我想应该是arr是原生对象，没有转换成jq对象。$(function(){vararr=[1,2,3,4,5];$arr=$(arr);$arr.each(function(i){console.log($arr[i])})})果然是这样，此时，控制台就可以打印出arr里的数据。另外，我发现jQuery还提供了一种方法$(function(){vararr=[1,2,3,4,5];$.each(arr,function(i){console.log(arr[i])})})原来，$.each()与$(selector).each()不同,后者专用于jqu
作为火了十多年的老牌明星类库jQuery，相信做前端的小伙伴肯定都或多或少的使用和追捧过，当然我也不例外，作为第一个学习的js类库，我曾经也觉得它是真正的唯一，帮助你处理恶心的浏览器CSS/JS等兼容性问题，而我只需要关注实际的业务逻辑即可，简单，快速和高产是jQuery早期的几个重要标签但是随着浏览器的持续迭代更新，及其相关新的API的出现，如果你只需要支持现代浏览器的话，也许现在你不再需要导入jQuery类库了，在这篇文章中，我们将介绍一些实际的Javacript代码，直接就可以替代我们常用的jQuery代码，希望大家会觉得比较实用~添加页面元素jQuery代码：$('i').prepend('
osCommercev2.3.4发布了。osCommerce是一套由自由软件开发社团开发并维护的在线商店的解决方案。由于遵循开源软件开发和发布协议，osCommerce可以自由下载、安装和使用，并可以根据自己的需要进行修改和发布，可以应用到任何的商业环境中，但是不能够利用本身进行营利性质的活动。osCommercev2.3.4是围绕提高核心特征的一般维护版本，引入了一个新的内容模块功能。UpdatejQueryUIfrom1.8.22to1.10.4.UpdatejQueryfrom1.8.0to1.11.1.UpdateFlot(jQueryLibrary)from0.6to0.8.3.ReplacebxGalleryandFancyBoxwithPhotosetGridandColorbox.FixheightofAdministrationToolboxes.Improve$PHP_SELFtoworkinsubdire
经过百度、谷歌、SF、stackoverflow后终于将webpack3引用jQuery的问题解决了，网上的重复文章太多，大多也都过时了，webpack这两年发展也非常快，大多都是1.0版本的文章，与时俱进的很少，刚刚看了一眼现在已经发展到3.5.5了，真正看其中一篇文章能解决问题的几乎没有，下面是webpack3的实现代码。首先在配置页面中加入外部引用externals:{jquery:"jQuery"//如果要全局引用jQuery，不管你的jQuery有没有支持模块化，用externals就对了。}然后在入口js中加入引用const$=require("jQuery");这样就可以了，是不是很简单？之前用了ProvidePlugin的方法，虽然$好用了，但是jQuery的方法都不能使用，如果朋友们知道为什么的可以留言给我。newwebpack.ProvidePlugin({$:'jquery',jQuery:'jquery'})当然引用jQuery库的方法不止这一种，大家可以讲一讲自己的方法，互相学习
html——————————————————————————————————————————————————————————————————————————————————————