У меня возникли проблемы с преобразованием этого 5-звездочного рейтингового скрипта, который отлично работает с версией jquery, выпущенной по дате: 2006-09-07 10:12:12 + 0200 (Do, 07 Sep 2006) $ * $ Rev: 276 $Проблема с преобразованием 5-звездочного рейтингового скрипта для работы с jQuery v1.3.2
Это функция addclass, removeeclass, .extend, которая, по моему мнению, является проблемой, но я не могу успешно конвертировать ее для работы с jquery v1. 3,2?
На самом деле это необходимо для работы как можно скорее.
Спасибо за вашу помощь ... stackoverflow.com РОКИ!
Вот как вы это называете:
<script type="text/javascript">
$(document).ready(function() {
$('#rate1').rating('postid', { maxvalue:5 });
});
</script>
<div id="rate1" class="rating"> </div>
Heres CSS-код:
.rating {
cursor: pointer;
margin: 0em;
display: block;
float:left;
}
.rating:after {
content: '.';
display: block;
height: 0;
width: 0;
clear: both;
visibility: hidden;
}
.cancel,
.star {
float: left;
width: 25px;
height: 25px;
overflow: hidden;
text-indent: -999em;
cursor: pointer;
}
.cancel,
.cancel a {background: url(delete.gif) no-repeat 0 -25px;}
.star,
.star a {background: url(star.gif) no-repeat 0 0px;}
.cancel a,
.star a {
display: block;
width: 100%;
height: 100%;
background-position: 0 0px;
}
div.rating div.on a {
background-position: 0 -25px;
}
div.rating div.hover a,
div.rating div a:hover {
background-position: 0 -50px;
}
И Heres рейтинг сценария:
function postrating(i) {
$("#rate_result").html(i);
}
function doSubmit() {
var rating = $('#result').html();
var reviewid = $('#reviewid').html();
if(rating == '1') {
alert('Are you kidding me!');
}
if(rating == '5') {
alert('Thanks for the 5 star rating!');
}
alert(rating);
alert(reviewid);
}
$.fn.rating = function(id, options) {
if(id == null) return;
var settings = {
id : id, // post changes to
maxvalue : 5, // max number of stars
curvalue : 0 // number of selected stars
};
if(options) {
$.extend(settings, options);
};
$.extend(settings, {cancel: (settings.maxvalue > 1) ? true : false});
var container = jQuery(this);
$.extend(container, {
averageRating: settings.curvalue,
id: settings.id
});
for(var i= 0; i <= settings.maxvalue ; i++){
var size = i
if (i == 0) {
if(settings.cancel == true){
var div = '';
container.append(div);
}
}
else {
var div = '<div class="star"><a href="javscript:void(0)" onclick="javscript:postrating('+ i +');" title="'+i+' out of 5">'+i+'</a></div>';
container.append(div);
}
}
var stars = $(container).children('.star');
stars
.mouseover(function(){
event.drain();
event.fill(this);
})
.mouseout(function(){
event.drain();
event.reset();
})
.focus(function(){
event.drain();
event.fill(this)
})
.blur(function(){
event.drain();
event.reset();
});
stars.click(function(){
if(settings.cancel == true) {
settings.curvalue = stars.index(this) + 1;
$.post(container.id, {
"rating": $(this).children('a')[0].href.split('#')[1]
});
return false;
}
else if(settings.maxvalue == 1) {
settings.curvalue = (settings.curvalue == 0) ? 1 : 0;
$(this).toggleClass('on');
$.post(container.id, {
"rating": $(this).children('a')[0].href.split('#')[1]
});
return false;
}
return true;
});
var event = {
fill: function(el){ // fill to the current mouse position.
var index = stars.index(el) + 1;
stars
.children('a').css('width', '100%').end()
.lt(index).addClass('hover').end();
},
drain: function() { // drain all the stars.
stars
.filter('.on').removeClass('on').end()
.filter('.hover').removeClass('hover').end();
},
reset: function(){ // Reset the stars to the default index.
stars.lt(settings.curvalue).addClass('on').end();
}
}
event.reset();
return(this);
}
Вы получаете ошибки? – czarchaic
Нет! 5 звезд появляются, но когда вы выделяете их ... как если бы вы выделили четвертую звезду, предыдущие четыре звезды не подсвечиваются и когда вы нажимаете ... как если бы вы нажмете на 3-ей звезду ... предыдущие 3 звезды не выделяется, но я получаю значение от звезды, когда вы нажимаете на нее. 1,2,3,4,5 – brandon
Ох ... звезда, нависшая над вами, меняет от серого до желтого! – brandon