Frage

Ich mache ein rating-system, und ich habe den folgenden jQuery-code auf meinem index.php Seite:

<script type="text/javascript">

$(document).ready(function() {

    $("[id^=rating_]").hover(function() {

        var rid = $(this).attr("id").split("_")[1];
        $("#rating_"+rid).children("[class^=star_]").children('img').hover(function() {

            $("#rating_"+rid).children("[class^=star_]").children('img').removeClass("hover");

            /* The hovered item number */
            var hovered = $(this).parent().attr("class").split("_")[1];
            var hovered2 = $(this).parent().attr("class").split("_")[1];

            while(hovered > 0) {
                $("#rating_"+rid).children(".star_"+hovered).children('img').addClass("hover");
                hovered--;
            }

            $("#rating_"+rid).children("[class^=star_]").click(function() {
                var current_star = $(this).attr("class").split("_")[1];

                $.post("send.php", {rating: current_star, id: rid});
            });
        });

    });




});

</script>

Im Grunde gibt es einen hover-Effekt und dann, wenn Sie klicken Sie auf die Sterne, es wird senden eine post-Anforderung an send.php mit der info auf der Bewertung klicken und die id des Elements.Unter diesem Skript habe ich einige PHP sieht wie folgt aus:

<?php


$query = mysql_query("SELECT * FROM test");

while($row = mysql_fetch_array($query)) {
    $rating = (int)$row[rating];
    ?>
    <div id="rating_<?php echo $row[id]; ?>">
    <span class="star_1"><img src="star_blank.png" alt="" <?php if($rating > 0) { echo"class='hover'"; } ?> /></span>
    <span class="star_2"><img src="star_blank.png" alt="" <?php if($rating > 1.5) { echo"class='hover'"; } ?> /></span>
    <span class="star_3"><img src="star_blank.png" alt="" <?php if($rating > 2.5) { echo"class='hover'"; } ?> /></span>
    <span class="star_4"><img src="star_blank.png" alt="" <?php if($rating > 3.5) { echo"class='hover'"; } ?> /></span>
    <span class="star_5"><img src="star_blank.png" alt="" <?php if($rating > 4.5) { echo"class='hover'"; } ?> /></span>
    <div class="clearleft">&nbsp;</div>
    </div>
    <br />
    <?php   
}

?>

Und dann muss ich natürlich einige CSS zu machen es schön Aussehen.

Die send.php die Datei sieht wie folgt aus:

<?php

mysql_connect("localhost", "admin", "") or die(mysql_error());
mysql_select_db("test") or die(mysql_error());


$rating = (int)$_POST['rating'];
$id = (int)$_POST['rid'];



$query = mysql_query("SELECT * FROM test WHERE id = '".$id."'") or die(mysql_error());

while($row = mysql_fetch_array($query)) {

    if($rating > 5 || $rating < 1) {
        echo"Rating can't be below 1 or more than 5";
    }
    else {

        $total_ratings = $row['total_ratings'];
        $total_rating = $row['total_rating'];
        $current_rating = $row['rating'];

        $new_total_rating = $total_rating + $rating;
        $new_total_ratings = $total_ratings + 1;
        $new_rating = $new_total_rating / $new_total_ratings;


        // Lets run the queries. 

        mysql_query("UPDATE test SET total_rating = '".$new_total_rating."' WHERE id = '".$id."'") or die(mysql_error());
        mysql_query("UPDATE test SET rating = '".$new_rating."' WHERE id = '".$id."'") or die(mysql_error());
        mysql_query("UPDATE test SET total_ratings = '".$new_total_ratings."' WHERE id = '".$id."'") or die(mysql_error());
    }

}




?>

Es gibt 3 Bewertung Spalten in der Datenbanktabelle;total_rating:Gesamt-Bewertungen (alle Bewertungen addiert).Bewertung:der aktuelle Bewertung total_ratings:die Menge an Bewertungen.

Das problem ist, wenn ich $_POST['rating'] und $_POST['rid'] zu $_GET und die Angaben, die int er-url, zum Beispiel, senden.php?id=1&rating=4, es funktioniert, und die Datenbank wird aktualisiert.Allerdings, wenn ich drücken Sie auf die Sterne, die Datenbank ist nicht aktualisiert.Nach Herumspielen mit den Skript habe ich realisiert, dass die post arbeiten muss, aber die id zurück, die als 0.

Um dies zu testen, weiter lege ich diese in die Klick-Funktion:

document.write(current_star+rid);

Um zu sehen, was zurückgegeben wurde.Das problem scheint zu sein, dass die Zahl, die zurückgegeben wird, multipliziert mit der Anzahl der Male, die ich den Mauszeiger über die Elemente.Also, wenn ich den Mauszeiger über vielleicht 6 der Sterne, dann die current_star und ID wiederholt sich 6 mal.

Ich fühle mich wie ich bin, so nahe an diesem zu arbeiten, hat jemand eine Idee, was ist es?Vielen Dank im Voraus.

War es hilfreich?

Lösung

Und wichtig über jQuery ' s event handling ist, dass es registry-basiert, was bedeutet, dass jQuery ermöglicht es Ihnen, sich zu registrieren mehrere Rückrufe für ein besonderes Ereignis, und es wird aufgerufen, die Sie in der Reihenfolge, in der Sie gebunden waren.

Der Grund, warum Sie sehen, wiederholt current_star und id Werte ist, weil Sie halten Bindung mehr und mehr Ereignisse, die auf jeden schweben.Dies ist, weil Ihre click() rufen Sie in Ihrem hover() rufen Sie daher jedes mal, wenn Sie schweben, binden Sie ein weiteres click () - Ereignis.

Versuchen Sie, Ihre Bindung click() Ereignis außerhalb Ihrer hover-Ereignis, mit so etwas wie dieses:

$("[id^=rating_]").children("[class^=star_]").click(function() {
        var rid = $(this).parent().attr("id").split("_")[1];
        var current_star = $(this).attr("class").split("_")[1];

        $.post("send.php", {rating: current_star, id: rid});
});

Vermutlich willst du auch nicht binden wollen ein hover() rufen Sie in den anderen, aus dem gleichen Grund.

Andere Tipps

Ich bemerkte Sie verwendet haben $_POST['rid'] statt $_POST['id'].Möglicherweise ist das dein problem.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top