<script type="text/javascript">
/*直接通过$.方法名称就可以定义一个全局的插件,这种定义带来的问题:
1.一般插件都需要通过一个独立的js文件来存储,命名的规则确定
2.如果将来$这个符号被jQuery.noconfilct()之后,如何保证还能继续使用*/
$.say=function(hello){
alert("hello"+hello);
}
$(function(){
$.say("ok");
});
</script>
//
<!-- 引入自定义插件 -->
jquery.util.movie.js:
/*jQuery.say=function(hello){
alert("Hello "+hello);
}*/
//jQuery.noConflict();
//此时的$就不再是jQuery中的$,而是闭包中的$,而闭包中的$又是jQuery对象
(function($){
$.say=function(hello){
alert("Hello "+hello);
}
/*如果有一个插件,参数很多,而且很多参数并不是必须的
* 如此在调用的时候就会非常麻烦*/
//$.complex=function(p1,a2,a3,a4,a5,a6,a7,a8){}
/*插件参数的解决方法一般是通过options来定义
* options中一般使用json来定义,这个时候就可以灵活地确定参数个数
* 在代码中通过extend方法完成覆盖*/
$.complex=function(p1,options,p2){
var settings=$.extend({
a2:"ok",
a3:"hello",
a4:"你好"
},options||{});
alert(p1+","+p2);
alert(settings.a2+","+settings.a3+","+settings.a4);
}
})(jQuery);
//传入jQuery作为参数,
///
<script type="text/javascript" src="jquery.util.movie.js"></script>
<script type="text/javascript">
/*直接通过$.方法名称就可以定义一个全局的插件,这种定义带来的问题:
1.一般插件都需要通过一个独立的js文件来存储,命名的规则确定
2.如果将来$这个符号被jQuery.noconfilct()之后,如何保证还能继续使用
解决方式:1.不再通过$,而是直接通过jQuery来调用,但是会增加工作量
2.通过闭包来解决,将插件定义全部放到一个闭包中
3.如何为插件确定参数,如果一个方法存在7个参数*/
$(function(){
$.say("ok");
$.complex(45,{a2:"98"},22);
});
</script>
//
<script type="text/javascript">
$(function(){
//检测浏览器是否是IE浏览器
//alert($.browser.mozilla );
/* if($.browser.msie){
//获取IE版本号
alert($.browser.version);
} */
/*each不仅可以遍历数组,还可以遍历对象,如果遍历的是数组,只有一个参数
遍历对象有两个参数*/
/*var person={name:"校长",age:29};
$.each(person,function(key,value){
alert(key+","+value);
}); */
var person1={name:"校长",age:29,address:"昭通"};
var person2={name:"女校长",age:45};
/*会用第二个参数来覆盖第一个参数,没有的就不进行覆盖,返回第一个参数,第二个参数不会变化*/
/* var p=$.extend(person1,person2);
alert(person1.name+","+person1.age+","+person1.address);
alert(p.name+","+p.age+","+p.address);
alert(person2.name+","+person2.age+","+person2.address); */
var po=new Object;
/*此时会把person2的值覆盖到person1中,并且存储到po中,并返回po*/
var p=$.extend(po,person1,person2);
/* alert("person1:"+person1.name+","+person1.age+","+person1.address);
alert("p:"+p.name+","+p.age+","+p.address);
alert("person2:"+person2.name+","+person2.age+","+person2.address);
alert("po:"+po.name+","+po.age+","+po.address); */
/*extends在写插件的时候极为有用*/
/*grep()有两个参数值,第一个表示元素值,第二个表示索引*/
/* var as=$.grep([1,2,3,4,5],function(n,i){
return n%2==0;
});
alert(as); */
var as=$.grep($("table tr"),function(n,i){
//也可以传入包装集
return $(n).find("td").is(":contains('张')");
});
//$(as).css("color","#f00");
//alert($.inArray("1",[1,23,4,5]));
/*如果找到返回所在下标,如果没有找到,返回-1*/
//alert($.inArray(1,[1,23,4,5]));
//alert($("table tr").toArray());
//可以对元素的属性进行统一处理
/* var ms=$.map([2,4,6,8],function(n){
return 10*n;
});
alert(ms); */
/* var ms=$.map({name:"aaa",age:123},function(value,key){
var v="";
if(key=='name'){
v="老张"
}
if(key=='age'){
if(value>100) v=99;
return "老张"
}
return v;
});
alert(ms); */
/* var a1=[1,2,3,4];
var a2=[2,34,5];
alert($.merge(a1,a2));
alert(a1); */
var p={username:"张三",age:23};
alert($.param(p));
});
</script>
///
(function($){
$.fixedTopicWidth=function(str,options){
//(abcasdfasdfasdfasdf,12,".")--->asdasdads...
var setting=$.extend(
{length:50,fill:null,fillLength:3},
options||{});
var pos=length-str.length;
if(pos>0){
return str;
}else{
if(setting.fill){
var fs="";
for(var i=0;i<setting.fillLength;i++){
fs=fs+setting.fill;
}
return (str.substr(0,setting.length-3)+fs);
}else{
return str.substr(0,setting.length);
}
}
}
/*使用$.fn来创建包装集插件*/
$.fn.setColor=function(){
/*此时的this指的是整个包装集对象,已经被封装为包装集
* 就不用再使用$(this)来封装*/
this.css("color","#0f0");
//基于包装集的函数一定要支持链式结构
return this;
}
$.fn.formatTopic=function(options){
this.each(function(){
/*这个时候的this就不再是包装集对象,而是这个闭包对象
* 此时闭包对象中的引用是一个html的节点,要访问就需要使用$(this)*/
$(this).html($.fixedTopicWidth($(this).html(),options));
});
}
/**
* 如果state为true就表示readonly,否则表示取消readonly
* */
$.fn.setReadOnly=function(state){
//1.找到所有的文本框
return this.filter("input:text").prop("readOnly",state)
.css("opacity",state?0.5:1.0);
}
})(jQuery);转载于:https://my.oschina.net/686991/blog/364478
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
