$.post() di jQuery non funziona

Question

Io sto facendo una valutazione di sistema, e ho il seguente codice jQuery sul mio index.php pagina:

<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>

Fondamentalmente c'è un effetto hover e poi quando si fa clic sulla stella, è necessario inviare una richiesta post send.php con le info sulla valutazione cliccato e l'id dell'elemento.Al di sotto di questo script ho un po ' di PHP che assomiglia a questo:

<?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   
}

?>

E poi, naturalmente, ho un po ' di CSS per farlo sembrare bello.

Il send.php file simile a questo:

<?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());
    }

}




?>

Ci sono 3 valutazione di colonne nella tabella del database;total_rating:valutazioni totali (tutti i voti sommati).valutazione:la valutazione attuale di total_ratings:la quantità di voti.

Il problema è che se cambio il $_POST['rating'] e $_POST['rid'] e $_GET e inserire le informazioni che int url, per esempio, inviare.php?id=1&valutazione=4, funziona, e il database viene aggiornato.Tuttavia, quando premo le stelle, il database non è aggiornato.Dopo smanettare con lo script che ho realizzato che il posto di lavoro devono essere, tuttavia, l'id restituisce 0.

Per testare ulteriormente questo ho messo questo in un clic la funzione:

document.write(current_star+rid);

Per vedere cosa è stato restituito.Il problema sembra essere che il numero che viene restituito è moltiplicato per la quantità di volte che mi passa il mouse sopra gli elementi.Quindi, se mi passa il mouse sopra forse, 6 delle stelle, quindi il current_star e l'ID sarà ripetuto 6 volte.

Mi sento così vicino ad ottenere questo lavoro, qualcuno ha avuto qualche idea di che cosa è in su con esso?Grazie in anticipo.

Answer 1

E cosa importante da realizzare su jQuery e la gestione degli eventi è che è basato sul registro di sistema, il che significa che jQuery permette di registrare più callback per qualsiasi evento particolare, e che richiamerà nell'ordine in cui erano legati.

Il motivo per cui stai vedendo ripetuto current_star e id valori è perché mantiene l'associazione a più e più eventi di ogni passaggio del mouse.Questo è perché hanno il click() chiamata all'interno del vostro hover() chiamata, quindi ogni volta che si passa, si legano a un altro evento click ().

Provare a legare il proprio click() evento al di fuori del tuo evento hover, utilizzando qualcosa di simile a questo:

$("[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});
});

Probabilmente non si desidera associare un hover() chiamata all'interno dell'altra, per lo stesso motivo.

Answer 2

Ho notato che hai usato $_POST['rid'] invece di $_POST['id'].Potrebbe essere questo il tuo problema.