[置顶] jQuery评星插件

$.fn.DyStar = function (option, callback) {  2     var defaults = {  3         count: 5,  4         url: 'images/star.gif'  5     };  6     var opt = $.extend(defaults, option),  7         obj = $(this);  8     obj.css({  9         width: 16 * opt.count, 10         height: 16 11     }); 12     for (i = 0; i < opt.count; i++) { 13         $("").css({ 14             width: 16, 15             height: 16, 16             float: "left", 17             "background-image": "url(" + opt.url + ")" 18         }).appendTo($(this)); 19     } 20  21    22         obj.each(function () { 23             if($(this).attr("data-value")){ 24                 $(this).children().not($(this).children("span:lt(" + $(this).attr("data-value") + ")").css("background-position", "0px 32px")).css("background-position", "0px 0px"); 25                 $(this).data("starcount",$(this).attr("data-value")-1); 26             } 27         }); 28  29      30  31     obj.filter("[data-readonly!='true']").on({ //只读的 不添加这些事件 32         click: function () { 33             obj = $(this).parent(); 34             var starindex = $(this).index() + 1; 35             obj.children().not($(this).prevAll().add($(this)).css("background-position", "0px 32px")).css("background-position", "0px 0px"); 36             obj.data("starcount", $(this).index()); 37             if (typeof option == 'function') { 38                 option(starindex); 39             } 40             if (typeof callback == 'function') { 41                 callback(starindex); 42             } 43         }, 44         mouseover: function () { 45             obj = $(this).parent(); 46             obj.children().not($(this).prevAll().add($(this)).css("background-position", "0px 16px")).css("background-position", "0px 0px"); 47         }, 48         mouseout: function () { 49             obj = $(this).parent(); 50             obj.children().not(obj.children("span:lt(" + (obj.data("starcount") + 1) + ")").css("background-position", "0px 32px")).css("background-position", "0px 0px"); 51         } 52     }, "span"); 53 }

用法：

  2   3   4       5     豆芽评星  6       7       8      14      24  25  26     
 27     
 28     
 29     
 
 
  30     下面的  都默认复制为2颗星 31      
 32     
 33      下面这个是只读的 其余的可以重选 34     
 35  36  37 


 
创新互联建站是一家专注于成都网站建设、成都网站制作与策划设计,张店网站建设哪家好?创新互联建站做网站,专注于网站建设十多年,网设计领域的专业建站公司;建站业务涵盖:张店等地区。张店做网站价格咨询:18980820575

文章标题：[置顶] jQuery评星插件
转载源于：http://ybzwz.com/article/ghhdoc.html

[置顶] jQuery评星插件

其他资讯