Question

jquery 插件写法，怎么写插件？

$("#title li").click(function(){
$(this).css("color","red").siblings().css("color","#000")
})
<ul id="title">
<li>菜单一</li>
<li>菜单二</li>
<li>菜单三</li>
<li>菜单四</li>
</ul>
实现上面的效果怎么写成插件的形式
jQuery.fn.extend({
changeColor:function(){
//怎么写
}
})
调用

$(" div").changeColor()

Answer 1

<script type="text/javascript">
    /*
     * 自定义控件
     * $.fn.**** 这里的 **** 是控件的名称
     * options = $.extend(defaults,options) 代表，如果options有的话就用options，或者使用default参数 
     * 调用方法：$("").****() 
     */
    (function($){
        $.fn.changeColor = function(options) {
            // 默认是 red 和 #000 两种颜色
            var defaults = {
            choose: "red",
            out: "#000"
        }
        var options = $.extend(defaults, options);
        // 绑定 click 事件
        this.click(function(){
            $(this).css("color",options.choose).siblings().css("color",options.out);
        })
    })(JQuery);
    
    $(function(){
        // 调用，让 choose 的时候为 green，参数也可以不写
        $("#title li").changeColor({"choose":"green"});
    })
</script>

追问

刚试了一下没效果啊

追答

有没有引用jquery？我上传一个，你自己看一下