1

我在这里有一个非常简单的问题，但是由于我对 jquery 的想法很少，因此无法解决这个问题

我正在使用这段代码来实现评分功能

http://www.dotnetcurry.com/ShowArticle.aspx?ID=440

一切正常，但我注意到一旦有人点击任何星星，它就无法更改评级。

这是代码

建立一个星阵

<p>
    <img src="Images/EmptyStar.png" alt="Star Rating" align="middle" id="1" />
    <img src="Images/EmptyStar.png" alt="Star Rating" align="middle" id="2" />
    <img src="Images/EmptyStar.png" alt="Star Rating" align="middle" id="3" />
    <img src="Images/EmptyStar.png" alt="Star Rating" align="middle" id="4" />
    <img src="Images/EmptyStar.png" alt="Star Rating" align="middle" id="5" />
</p>

JS部分

$("img").mouseover(function() {
    giveRating($(this), "FilledStar.png");
    $(this).css("cursor", "pointer");
});

$("img").mouseout(function() {
    giveRating($(this), "EmptyStar.png");
});

//-------

function giveRating(img, image) {            
    img.attr("src", "Images/" + image).prevAll("img").attr("src", "Images/" + image);
}

现在，一旦有人点击任何星星，点击事件就会生效并按如下方式解除绑定：

$("img).click(function () {
    $(img).unbind("mouseout mouseover click");
});

我在看的是，即使有人点击了任何开始，他也应该能够再次更改它，或者选择更高或更低的评级

如果有人可以指导我这个简单的事情，那将是高度赞赏

提前感谢您的时间和努力

4

1 回答 1

0

首先删除这个：

$(img).unbind("mouseout mouseover click");

此外，您必须存储评级并在搬出后恢复......

function giveRating(img, image) {            
    img.attr("src", "Images/" + image).prevAll("img").attr("src", "Images/" + image);
    img.parent().get(0).rating = img;
}

...

对不起，我很乐意完成这个。也许其他人会？

或者看看http://www.fyneworks.com/jquery/star-rating/

为此，有许多现成的解决方案。

于 2012-09-19T16:37:37.787 回答