关于拓展jQuery功能插件的写法
有两种方法:
1.jQuery.fn.extend()
用于将一个对象的内容合并到jQuery的原型,以提供新的jQuery实例方法
例子:
<span id="test">测试文字</span> //需要控制的节点
<input type="color" id="color"> //获取color色值
<script>
;(function($){ //利用闭包特性 ,$表示形参。 形参是“形式参数”,不实际存在变量,在定义函数体中用来接收参数
$.fn.extend({ //jQuery.fn.extend
"color":function(value){ //拓展color实例方法 value是形参
return this.css("color",value); //返回颜色设定
}
});
})(jQuery); //传入了jQuery实参, 实参是在调用函数时传入的参数,要有确定的值
$('#color').on('change',function(){ //对节点绑定change
$('#test').color($(this).val()); //调用color实例方法,$(this).val()是实参,有实际值。
})
</script>
2.jQuery.extend()
jQuery.extend()方法用一个或多个其他对象来扩展一个对象,然后返回被扩展的对象
例子
function foo(options){
return options=jQuery.extend({ //options内的值与默认参数进行比对,如果冲突,options的值会替代默认参数
name:"old",
age:18,
sex:"man"
},options)
}
console.log(foo({name:'new',age:25}));
关于拓展jQuery功能插件的写法的更多相关文章
- 【JQUERY】插件的写法
1. jquery插件怎么写 $.extend $.fn 2. 写的时候注意些什么
- 自己diy一个jquery分页插件
js基础学习过程中,期间经历换工作的各种面试,很多面试官问过:有没有写过jquery插件?等类似问题. 就个人而言,关于jquery插件的文章确实看过不少,但是一直没有动手写一个,一是不想在目前学习j ...
- jQuery扩展插件和拓展函数的写法
<script type="text/JavaScript"> //jQuery插件的写法(需要传入操作对象) ;(function ...
- 图片放大功能插件及jquery.extend函数理解
前端时间,产品提出社区评论中的图片需要有放大功能.感觉可以共用,所以就想整合一个插件,过程中也借鉴了一些例子. 分析下自己的代码思路: var scaleImg = function(opts) { ...
- JQuery插件的写法 (转:太棒啦!)
JQuery插件写法的总结 最近Web应用程序中越来越多地用到了JQuery等Web前端技术.这些技术框架有效地改善了用户的操作体验,同时也提高了开发人员构造丰富客户 端UI的效率.JQuery本身提 ...
- asp.net 实现在线打印功能,jQuery打印插件PrintArea实现自动分页
使用的组件:jQuery打印插件PrintArea,有兴趣的可以研究一下. 使用方法略过,这里将介绍如何实现打印多页是可以分页. 现在提供两种方法思路: 1.根据特定的打印机型号和使用的纸张类型,然后 ...
- 基于 jQuery Jcrop 插件的功能模块:头像剪裁
/** Jcrop version: 0.9.12 jQuery version: 1.9.0 Author: 小dee Date: 2014.10.30 */ 先看看他山之石:博客园的头像模块也是使 ...
- jquery插件的写法
jquery插件及zepto插件,写法上有些区别. 区别点: 1.自定义事件的命名空间 jq的时间命名空间是用点“.”,而zepto是用冒号“:” 如 //jquery $(this).trigger ...
- 闭包,jQuery插件的写法:图片预加载
最近做的一些网页,单个网页图片量都比较大,网络不好的情况下,特别卡,这个图片预加载的方法可以牺牲一些时间换来网页的浏览顺畅,还是值得的. //闭包的写法,它内部的变量都是局部的,不会和外部巳有的变量进 ...
随机推荐
- tf中softmax_cross_entropy_with_logits与sparse_softmax_cross_entropy_with_logits
其实这两个都是计算交叉熵,只是输入数据不同. #sparse 稀疏的.稀少的 word_labels = tf.constant([2,0]) predict_logits = tf.constant ...
- ES6 学习笔记之三 函数参数默认值
定义函数时为参数指定默认值的能力,是现代动态编程语言的标配.在ES6出现之前,JavaScript是没有这种能力的,框架为了实现参数默认值,用了很多技巧. ES6 的默认参数值功能,与其他语言的语法类 ...
- 【mysql】使用Navicat连接数据库
1 连接数据库 点击左下角测试一下 提示 输入 select host,user,plugin,authentication_string from mysql.user; 查看用户信息 注意这里我们 ...
- 用MVC5+EF6+WebApi 做一个考试功能(五) 前端主题
内容概述 前面絮絮叨叨没正事,到现在为止也没有开始写代码,不过在考虑下貌似这一节还是开始不了. B/S架构开发有一个特点,就是用浏览器打开,不同的用户群体可能有不同的风格,不论是管理平台还是普通的网站 ...
- .net core webapi+EF Core
.net core webapi+EF Core 一.描述: EF Core必须下载.net core2.0版本 Micorsoft.EntityFrameworkCore:EF框架的核心包Micor ...
- webstrom 一直反复indexing
从网上找了找答案 好多说 把大的静态文件exclude(在项目文件上右击-->Mark Directory As -->exclude)出去,可是不管用.我刚发生的情况是一直刷新,一遍一遍 ...
- elasticsearch Geo Bounding Box Query
Geo Bounding Box Query 一种查询,允许根据一个点位置过滤命中,使用一个边界框.假设以下索引文档: PUT /my_locations { "mappings" ...
- 【JavaScript】call和apply区别及使用方法
一.方法的定义call方法: 语法:fun.call(thisArg[, arg1[, arg2[, ...]]])定义:调用一个对象的一个方法,以另一个对象替换当前对象.说明:call 方法可以用来 ...
- pythonweb框架Flask学习笔记03-变量规则
#-*- coding:utf-8 -*- from flask import Flask app=Flask(__name__) @app.route('/post/<int:postid&g ...
- vue项目在IE下报 [vuex] vuex requires a Promise polyfill in this browser问题
如下图所示,项目在IE11下打开报错: 因为使用了 ES6 中用来传递异步消息的的Promise,而IE浏览器都不支持. 解决方法: 第一步: 安装 babel-polyfill . babel-po ...