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 に答える