jquery插件扩展举例

/**
**作者:mofijeck**
**时间:2014-12-30**
**功能:jquery插件扩展举例,高亮显示hilight**
**使用方法举例
$(".hilight").hilight();
或者
$(".hilight").hilight({ background: 'red', foreground: 'white' });
**/
// 创建一个闭包    
(function ($) {
    
})(jQuery);

//闭包扩展写法 防止被其他js污染
+function ($) {
    // 插件的定义
    $.fn.hilight = function (options) {
        debug(this);
        try {
            // build main options before element iteration    
            var opts = $.extend({}, $.fn.hilight.defaults, options);
            // iterate and reformat each matched element    
            return this.each(function () {
                $this = $(this);
                // build element specific options    
                var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
                // update element styles    
                $this.css({
                    backgroundColor: o.background,
                    color: o.foreground
                });
                var markup = $this.html();
                // call our format function    
                markup = $.fn.hilight.format(markup);
                $this.html(markup);
            });
        }
        catch (e) { 
            alert(e)
        }
    };
    // 私有函数:debugging    
    function debug($obj) {
        if (window.console && window.console.log)
            window.console.log('hilight selection count: ' + $obj.size());
    };
    // 定义暴露format函数    
    $.fn.hilight.format = function (txt) {
        return '<strong>' + txt + '</strong>';
    };
    // 插件的defaults    
    $.fn.hilight.defaults = {
        foreground: 'red',
        background: 'yellow'
    };
    // 闭包结束    
} (jQuery)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值