jQuery 标记当前函数 开始写一个简单的插件

今天闲来没事，写个 jQuery 插件方面的东西，比较入门和基础。
首先我们写一个函数 这个函数的作用是标记当前  给当前选中的元素添加一个可以识别的样式 如 class="current" 这个效果我们在网页的效果中会经常用到。

function cur(ele,currentClass,tag){ //三个参数 ele:jQ对象或者选择符;currentClass:当前类名;tag:限制标签
        ele= $(ele)? $(ele):ele; //取得要标记的对象 
        if(!tag){//如果没有标签限制 标记当前 取消标记同级元素
            ele.addClass(currentClass).siblings().removeClass(currentClass);

            }else{//如果限制标签 则标记当前 取消标记同级同名元素 
 ele.addClass(currentClass).siblings(tag).removeClass(currentClass);

                }

使用也很简单。 例：

cur($(".box li:last","current")); //直接标记某元素
$(".box li").click(function(){ cur(this,"cur")}); //通过点击标记当前元素
$("p").mouseover(function(){ cur(this,"cur","p")}); //通过鼠标划标记当前元素 p 

好，我们把这个函数翻译成插件的形式:

$.fn.cur=function(options){    
    var settings={ //默认设置
        curClass:"cur", //默认的当前类名为 cur
        tag:"", //不设置标签限制
        act:"mouseover" //默认触发动作为 鼠标划过
        }
    if(options){ //如果有字设置选项 则合并
        $.extend(settings,options);
        }        
    var _this= $(this); //当前对象    
    _this.bind(settings.act,function(){  //绑定到动作
        $(this).addClass(settings.curClass) // 标记当前 取消标记其他元素
             .siblings(settings.tag).removeClass(settings.curClass);
             })        
    }

插件方式的使用样例：

$("#curele").find("li").cur({act:"click"}); //通过点击标记当前 使用默认的 cur class
$("#curp").find("p").cur({tag:"p"}); //鼠标划过 #curp p 标记当前的 p 标签

这个例子很简单 告诉我们一个方法，如果想写一个插件又觉得没有地方下手，就从熟悉的函数开始吧，编写一个你熟悉的函数，用插件的形式翻译一下，很快就会熟悉插件的编写形式了。