我正在尝试缩小这个范围......但无法找到一种方法来做到这一点。基本上想知道是否有任何方法可以将其压缩到 5 行左右?
谢谢你的帮助!
$(function() {
$('.star-one').live("click",function() {
$("#rate_result").html('1');
$("#star1").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
});
$('.star-two').live("click",function() {
$("#rate_result").html('2');
$("#star1").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star2").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
});
$('.star-three').live("click",function() {
$("#rate_result").html('3');
$("#star1").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star2").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star3").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
});
$('.star-four').live("click",function() {
$("#rate_result").html('4');
$("#star1").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star2").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star3").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star4").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
});
$('.star-five').live("click",function() {
$("#rate_result").html('5');
$("#star1").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star2").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star3").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star4").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
$("#star5").html('<img src="http://larsonreviews.com/rating/star_ena.gif" border="0">');
});
});
这是html:
<div id="rate_result"></div>
<div id="stars-container">
<ul class='star-rate'>
<li id="star1">
<a href='#' title='' class="star-one" id="1">mmmm</a>
</li>
<li id="star2">
<a href='#' title='' class="star-two" id="2">try again</a>
</li>
<li id="star3">
<a href='#' title='' class="star-three" id="3">mmm not bad</a>
</li>
<li id="star4">
<a href='#' title='' class="star-four" id="4">this is cool ya!</a>
</li>
<li id="star5">
<a href='#' title='' class="star-five" id="5">very good</a>
</li>
</ul>
</div>