【jquery插件开发模板】教程文章相关的互联网学习教程文章

无限树Jquery插件zTree的使用方法【代码】

其实Ztree官网已经有详细的API文档,一切以官网上的说明为准,我在此只是结合实践总结几条常用的ztree的功能特性. (ztree的语法结构是基于key-value的形式配置) 1:支持异步加载数据  语法配置:async: {enable: true, url:‘abc.ashx‘,otherParam: { "request": "requestname" }}  简要说明:     enable :设置 zTree 是否开启异步加载模式.      url:Ajax 获取数据的 URL 地址.     otherParam:Ajax 请求提...

jQuery插件之Cookie插件使用方法~

一、介绍1-1、jQuery.Cookie.js插件是一个轻量级的Cookie管理插件。下载地址:jQuery-cookie.js 有需要的朋友,右键另存为即可!二、使用方法2-1、引入jQuery及jQuery.Cookie.js插件。<script src="jQuery.x.x.x.js" type="text/javascript"></script><script src="jquery.cookie.js" type="text/javascript"></script>注:jQuery文件引入要在插件jquery.cookie前,因为jquery.cookie插件依赖jquery 类库! 2-2、函数属性简介  ...

7月3日 学习仿腾讯游戏首页小幻灯片jquery插件

<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <style> img{border:0px;font-size:0;} .banner{position:relative;width:960px;height:170px;overflow:hidden;margin:1px auto;} .mybox{ height: 100%;width: 200%;overflow: hidden;position: absolute;right: 0;top: 0;} .mybox .fPics{position:relative;float:right;height:100%;width:39%;background:#F3F9F8;} ...

jquery 插件原则

区分开 Dom 对象,jQuery Dom对象, Json数据。Dom对象是诸如: document.getElementById 返回的原生Dom对象。jQuery Dom对象,如:$("#Id"),它是一个jQuery数组。Json数据,是{}对象,可用于参数对象,或 jQuery插件内部对象。 1. 每个jQuery插件,仅占用一个jQuery扩展方法,其它方法通过参数传递。如:创建一个插件: $("dom").TextHelper(p);其它方法: $("dom").TextHelper("show");2.可以重复使用扩展方法如 $("dom").Text...

jQuery插件之-selectList

基于jQuery的对select操作的插件有不少,jQuery插件selectList可以用于替换标准的HTML 多选 select 标签,它提供一个漂亮并且更加友好的界面,在IE和非IE内核浏览器上表现基本一致,除了IE6下重复项不能变成灰色的,当然功能表现都是一致的。当用户从下拉列表中选一个项目时,被选中的项目将在控件下方显示,而且还可以删除,被选中的项目不能重复选择。插件用于需要多项选择的地方还是不错的,当然如果select能够美化下会更好了,...

2020.05.06 JQuery的插件实现方式【图】

方式1:$.fn.extend(object)<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>01-jQuery对象进行方法扩展</title> <script src="../js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //定义jquery的对象插件 $.fn.extend({ //定义了一个checkFn方法,所有的jq对象都可以使用该方法 check:function(){ ...

JQuery插件-放大镜特效【代码】【图】

一.HTML代码:<div class="demo"><div id="box"><div id="small-box"><div id="float-box"></div><img src="../images/bimg_big.jpg"/></div><div id="big-box"><img src="../images/bimg_big.jpg"/></div></div></div>在div demo中存放两个div,其中small-box用来存放小图片和放大镜区域,big-box用来存放大图片。而放大图片的原理就是以小图片上的放大镜的位置,来定位大图片的移动和显示部分区域,来达到放大的效果。二.js代码1....

jQuery插件接口的实现【代码】

http://www.imooc.com/code/3403如果jQuery没有插件接口的设计,那么他就像个光杆司令没有兵,就是没有手下,只有自己一个封闭的城堡。因此jQuery城堡需要设计一个大门 - 插件接口,从而打开大门开始招兵买马。当然jQuery除了获得“开发者社区”的大力支持外,也有很多大公司纷纷对它投出了橄榄枝,这也是它成功的关键。 基于插件接口设计的好处也是颇多的,其中一个最重要的好处是把扩展的功能从主体框架中剥离出去,降低了...

jquery插件开发尝试(二)【代码】【图】

经过上次的尝试,已初步掌握jquery插件的写法,下面为模拟jquery UI插件的效果:html:<!DOCTYPE html> <html><head><meta charset="utf-8"/><meta content="width=device-width, initial-scale=1.0,minimun-scale=1.0 maximum-scale=1.0, user-scalable=no" name="viewport"/><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"/><title>jquery menu插...

jQuery插件之validate【代码】【图】

一、jQuery.validate.js插件用于对表单输入进行验证,其使用配置非常简单。支持多事件触发,自带多种验证规则,还支持自定义验证规则。  1、配置方法。   先导入jQuery库,然后导入Validate插件,如果是中文提示还需要导入messages_zh.js。   注意Validate的导入要在jQuery库之后。代码如下: <script src="jQuery.1.8.3.js" type="text/javascript"></script><script src="jquery.validate.js" type="text/javascript"><...

jquery插件开发模板【代码】

(function($){ $.fn.extend({ //将可选择的变量传递给方法pluginname: function(options) { //设置默认值并用逗号隔开var defaults = { padding: 20, mouseOverColor : ‘#000000‘, mouseOutColor : ‘#ffffff‘ } var options = $.extend(defaults, options); returnthis.each(function() { var o = options; //这里编写相应代码 //可以像下边这样获取变量值 alert(o.padding); }); } }); })(j...

jquery插件,表单验证validation plugin的使用【代码】

笔记:一、首先引入插件 <script type="text/javascript" src="js/jquery-1.10.0.js" ></script><script type="text/javascript" src="js/jquery.validate-1.13.1.js" ></script>列子:一个简单的登录表单验证 1<form id="loginForm"> 2<label for="userName">用户名:</label> 3<input type="text" id="user" name="userName"/> 4<br /><br /> 5<label for="passWord">密码:</label> 6<input type="password" id="passWord" nam...

程序员们必备的10款免费jquery插件

本周带来10款免费的jquery插件。如果你也有好的作品,欢迎分享到社区中来,在得到帮助的同时,也能与更多人分享来自你的作品。jQuery导航菜单置顶插件 - stickyUp 。在线演示stickyUp是一款可以帮助你生成置顶效果的jquery插件,如果你希望生成一个固定页面顶端的导航效果,可以使用stickUp来快速生成。非常实用的回弹菜单在线演示这是一款实用型的菜单插件,可以用在很多地方,点击链接可以查看到在线演示并获得免费下载。使用jQu...

jQuery插件——下拉选择框【代码】

其实,之前也写过jQuery插件,今天写的是一个模拟select选择的下拉插件。既然是jQuery插件,那么必然是依赖jQuery的了。老规矩,直接上代码吧!;(function () {$.fn.extend({dropdown:function (options) {return this.each(function (i, val) {$(val).css("position", "relative");// 设置默认参数var opts = $.extend({color: "#28c4ff",items: [{key1: "选项一"},{key2: "选项二"},{key3: "选项三"},{key4: "选项四"},{key5: "选...

js网页雪花效果jquery插件

1,使用前先导入jquery类库 2,导入雪花特效js类库 jq.snow.min.js 3,初始化代码 <script>$(function(){$.fn.snow({minSize : 5, //雪花的最小尺寸 默认5maxSize : 40, //雪花的最大尺寸 默认40newOn : 200, //雪花出现的频率 这个数值越小雪花越多 默认200showStyle : 0, //雪花样式1~17,默认是0flakeColor : ‘#FFFFFF‘, //雪花颜色 默认白色 #FFFFFFspeed : 15 //雪花下降速度 默认15}...