Heim > Backend-Entwicklung > PHP-Tutorial > jQuery+PHP implementiert den in Einkaufszentren häufig verwendeten Sternebewertungseffekt

jQuery+PHP implementiert den in Einkaufszentren häufig verwendeten Sternebewertungseffekt

angryTom
Freigeben: 2023-04-08 08:46:01
nach vorne
2591 Leute haben es durchsucht

jQuery+PHP implementiert den in Einkaufszentren häufig verwendeten Sternebewertungseffekt

jQuery+PHP implementiert den in Einkaufszentren häufig verwendeten Sternebewertungseffekt. Nachdem wir Waren auf der Mall-Plattform gekauft haben, wird es eine Bewertungsfunktion geben .

Zuerst fügen wir den angezeigten grauen Stern p#big_rate, den hellen Stern p#big_rate_up, den Bruchteil span#s und span#g sowie die Eingabeaufforderung p#my_rate zu .rate hinzu.
Dann schreiben wir eine Methode get_rate(), um die Bewertung zu erhalten:


function get_rate(rate) { 
    rate = rate.toString(); 
    var s; 
    var g; 
    $("#g").show(); 
    if (rate.length >= 3) { 
        s = 10; 
        g = 0; 
        $("#g").hide(); 
    } else if (rate == "0") { 
        s = 0; 
        g = 0; 
    } else { 
        s = rate.substr(0, 1); 
        g = rate.substr(1, 1); 
    } 
    $("#s").text(s); 
    $("#g").text("." + g); 
    $(".big_rate_up").animate({ 
        width: (parseInt(s) + parseInt(g) / 10) * 14, 
        height: 26 
    }, 
    1000); 
    $(".big_rate span").each(function() { 
        $(this).mouseover(function() { 
            $(".big_rate_up").width($(this).attr("rate") * 14); 
            $("#s").text($(this).attr("rate")); 
            $("#g").text(""); 
        }).click(function() { 
            var score = $(this).attr("rate"); 
            $("#my_rate").html("您的评分:<span>" + score + "</span>"); 
            $.ajax({ 
                type: "POST", 
                url: "ajax.php", 
                data: "score=" + score, 
                success: function(msg) { 
                    //alert(msg); 
                    if (msg == 1) { 
                        $("#my_rate").html("<span>您已经评过分了!</span>"); 
                    } else if (msg == 2) { 
                        $("#my_rate").html("<span>您评过分了!</span>"); 
                    } else { 
                        get_rate(msg); 
                    } 
                } 
            }); 
        }) 
    }) $(".big_rate").mouseout(function() { 
        $("#s").text(s); 
        $("#g").text("." + g); 
        $(".big_rate_up").width((parseInt(s) + parseInt(g) / 10) * 14); 
    }) 
}
Nach dem Login kopieren

Dann rufen wir einfach die Methode direkt auf:


get_rate(<?php echo $aver; ?>);
Nach dem Login kopieren

ajax.php empfängt den vom Frontend gesendeten Bewertungswert und ermittelt mithilfe von Cookies die Benutzer-IP und die Bewertungszeit, um eine wiederholte Bewertung zu verhindern.


$score = $_POST[&#39;score&#39;]; 
if (isset($score)) { 
    $cookiestr = getip(); 
    $time = time(); 
    if (isset($_COOKIE[&#39;person&#39;]) && $_COOKIE[&#39;person&#39;] == $cookiestr) { 
        echo "1"; 
    } elseif (isset($_COOKIE[&#39;rate_time&#39;]) && ($time - intval($_COOKIE[&#39;rate_time&#39;])) < 60) { 
        echo "2"; 
    } else { 
        $query = mysql_query("update raty set voter=voter+1,total=total+&#39;$score&#39; where id=1"); 
        $query = mysql_query("select * from raty where id=1"); 
        $rs = mysql_fetch_array($query); 
        $aver = 0; 
        if ($rs) { 
            $aver = $rs[&#39;total&#39;] / $rs[&#39;voter&#39;]; 
            $aver = round($aver, 1) * 10; 
        } 
        //设置COOKIE 
        setcookie("person", $cookiestr, time() + 3600 * 365); 
        setcookie("rate_time", time(), time() + 3600 * 365); 
        echo $aver; 
    } 
}
Nach dem Login kopieren

Raty-Tabellenstruktur:


CREATE TABLE IF NOT EXISTS `raty` (  
   `id` int(11) NOT NULL auto_increment,  
   `voter` int(10) NOT NULL default &#39;0&#39; COMMENT &#39;评分次数&#39;,  
  `total` int(11) NOT NULL default &#39;0&#39; COMMENT &#39;总分&#39;,  
   PRIMARY KEY  (`id`)  
 ) ENGINE=MyISAM  DEFAULT CHARSET=utf8;
Nach dem Login kopieren

Denken Sie abschließend daran, der Raty-Score-Tabelle ein Datenelement hinzuzufügen .

Dieser Artikel stammt von der chinesischen PHP-Website, Spalte PHP-Tutorial , willkommen zum Lernen!

Das obige ist der detaillierte Inhalt vonjQuery+PHP implementiert den in Einkaufszentren häufig verwendeten Sternebewertungseffekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:cnblogs.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage