Question

我不是javascript大师所以请耐心等待我。

我正在寻找js的好评，我跑到了他的博客：

http://www.marcofolio.net/webdesign/jquery_quickie_colourful_rating_system_with_css3.html

作者有一个演示，并提供了下载代码。

它看起来非常好，除了它没有保存颜色的例子。因此，一旦用户将鼠标移开，颜色将恢复为黑色（默认颜色）。

任何想法如何修复颜色？

Answer 1

除了TimDog添加的代码：

添加

_rated = false;

到

$(".fav_rating li label").hover(function() {

每次用户将鼠标悬停在评级上时，

都会重置颜色。然后，当他们单击_rated设置为true时，因此会阻止颜色更改

另外，我在表单中使用了一个隐藏的输入，它将包含评级的值。要做到这一点，我的.click如下所示：

$(".fav_rating li label").click(function(e) {
    e.preventDefault();
    _rated = true;
    $("#item_fav_rating").val($(this).parent().index() + 1)
});

Answer 2

这是一种方式 - 我仔细查看了示例代码中的script.js：

在animationTime

下添加此全局变量

var _rated = false;

这里重置颜色 - 看看我如何使用_rated变量？

// Restore all the rating to their original colours
if (_rated) $("#rating li a").stop().animate({ backgroundColor : "#333" } , animationTime);

然后在你的点击处理程序中：

//Prevent the click event and show the rating
$("#rating li a").click(function (e) {
    e.preventDefault();
    _rated = true;
    //alert("You voted on item number " + ($(this).parent().index() + 1));
});

这样可以突出显示颜色。刷新页面或重新运行上面的重置动画行时，它将被重置。

希望这有帮助。

Answer 3

我还没有看到你提到的博客的代码，但似乎当用户点击任何按钮时它显示警告，即使用了onclick（）。所以你可以有一个全局变量来保存数字，你自己可以添加代码来保持颜色。

Javascript评级系统

3 个答案: