rank 和 星星评级

我们常常看到打分,如下图

这样的效果有几种方法

1.用:lt(index)

/*	
	$('dl').each(function(){
		var ths = $(this);
		$(this).find('dd').click(function(){
			ths.find('dd').removeClass('selected');
			ths.find('dd:lt('+ ($(this).index()+1) +')').addClass('selected');
		}).dblclick(function(){
			$(this).removeClass('selected');
		})
	});
*/
	$('dd').click(function(){
		var num = $(this).index();
		$('dd').removeClass('selected');//先移除所有的效果
		$('dd:lt('+(num+1)+')').addClass('selected');//小于这个index的dd执行
	}).dblclick(function(){//双击
		$('dd').removeClass('selected');
	});
})

2prevAll()和nextAll()方法的结合

$(function(){
$("dd").click(function(){ $(this).addClass("selected"); $(this).prevAll().addClass("selected"); $(this).nextAll().removeClass("selected"); }); $("dd").dblclick(function(){ $("dd").removeClass("selected"); });
);

 

你可能感兴趣的:(rank 和 星星评级)