1、一直对jquery插件感觉很神秘。今天动手写了一个超级简单的案例。
2、效果
3、体会
a、jquery插件编写能力。需要具备一定js能力的编写。还有写css样式的运用;希望以后这方面会有提高。
b、能封装插件尽量封装;
c、面向对象的方式去写对象;
4、代码
/**
* Created by Administrator on 2015/8/17 0017.
*/
(function ($) {
$.fn.tableUI = function (options) {
var defalus = {
evenRowClass: "evenRow",
oddClass: "oddRow",
activeRowClass: "activeRow"
}
var options = $.extend(defalus, options);
// do somethings
this.each(function () {
var thisTable = $(this);
//添加奇偶行颜色
$(thisTable).find("tr:even").addClass(options.evenRowClass);
$(thisTable).find("tr:odd").addClass(options.oddClass);
//添加活动行颜色
$(thisTable).find("tr").bind("mouseover", function () {
$(this).addClass(options.activeRowClass);
});
$(thisTable).find("tr").bind("mouseout", function () {
$(this).removeClass(options.activeRowClass);
});
});
}
})(jQuery);
5、源代码