PHP评分系统

Jun 23, 2016 pm 02:31 PM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gbk" /><title>Title</title><style type="text/css"><!--body {background:#fff;text-align:center;margin:0 auto;padding: 0;font:12px Arial;color:#000;line-height:1.2em}div,form,img,ul,ol,li,dl,dt,dd {margin: 0; padding: 0; border: 0;}h1,h2,h3,h4,h5,h6 { margin:0; padding:0;}table,td,tr,th{font-size:12px;}/* 星级评分 */.shop-rating {    height: 25px;    overflow: hidden;    zoom: 1;    padding: 2px 0px;    position: relative;    z-index: 999;}.shop-rating span {    height: 23px;    display: block;    line-height: 23px;    float: left;}.shop-rating span.title {    width: 125px;    text-align: right;    margin-right: 5px;}.shop-rating ul {    float: left;	margin:0;padding:0}.shop-rating .result {    margin-left: 20px;    padding-top: 2px;}.shop-rating .result span {	color: #ff6d02;}.shop-rating .result em {    color: #f60;    font-family: arial;    font-weight: bold;}.shop-rating .result strong {	color: #666666;	font-weight: normal;}.rating-level,.rating-level a {    background: url(startpic/star_v2.png) no-repeat scroll 1000px 1000px;}.rating-level {    background-position: 0px 0px;    width: 120px;    height: 23px;    position: relative;    z-index: 1000;}.rating-level li {    display: inline;}.rating-level a {    line-height: 23px;    height: 23px;    position: absolute;    top: 0px;    left: 0px;    text-indent: -999em;    *zoom: 1;}.rating-level a.one-star {    width: 20%;    z-index: 6;}.rating-level a.two-stars {width: 40%;z-index: 5;}.rating-level a.three-stars {    width: 60%;    z-index: 4;}.rating-level a.four-stars {    width: 80%;    z-index: 3;}.rating-level a.five-stars {    width: 100%;    z-index: 2;}.rating-level .current-rating,.rating-level a:hover{background-position:0 -28px;}.rating-level a.one-star:hover,.rating-level a.two-stars:hover,.rating-level a.one-star.current-rating,.rating-level a.two-stars.current-rating{background-position:0 -116px;}.rating-level .three-stars .current-rating,.rating-level .four-stars .current-rating,.rating-level .five-stars .current-rating{background-position:0 -28px;}--></style></head><body><div class="shop-rating">	<span class="title">卖家服务的态度:</span>	<ul class="rating-level" id="stars1">		<li><a class="one-star" star:value="1" href="#">1</a></li>		<li><a class="two-stars" star:value="2" href="#">2</a></li>		<li><a class="three-stars" star:value="3" href="#">3</a></li>		<li><a class="four-stars" star:value="4" href="#">4</a></li>		<li><a class="five-stars" star:value="5" href="#">5</a></li>	</ul>	<span class="result" id="stars1-tips"></span>    <input type="hidden" id="stars1-input" name="b" value="" size="2" /></div><div class="shop-rating">	<span class="title">宝贝与描述相符:</span>	<ul class="rating-level" id="stars2">		<li><a class="one-star" star:value="1" href="#">1</a></li>		<li><a class="two-stars" star:value="2" href="#">2</a></li>		<li><a class="three-stars" star:value="3" href="#">3</a></li>		<li><a class="four-stars" star:value="4" href="#">4</a></li>		<li><a class="five-stars" star:value="5" href="#">5</a></li>	</ul>	<span class="result" id="stars2-tips"></span>    <input type="hidden" id="stars2-input" name="b" value="" size="2" /></div><div class="shop-rating">	<span class="title">卖家发货的速度:</span>	<ul class="rating-level" id="stars3">		<li><a class="one-star" star:value="1" href="#">1</a></li>		<li><a class="two-stars" star:value="2" href="#">2</a></li>		<li><a class="three-stars" star:value="3" href="#">3</a></li>		<li><a class="four-stars" star:value="4" href="#">4</a></li>		<li><a class="five-stars" star:value="5" href="#">5</a></li>	</ul>	<span class="result" id="stars3-tips"></span>    <input type="hidden" id="stars3-input" name="b" value="" size="2" /></div><div class="shop-rating">	<span class="title">物流公司的速度:</span>	<ul class="rating-level" id="stars4">		<li><a class="one-star" star:value="1" href="#">1</a></li>		<li><a class="two-stars" star:value="2" href="#">2</a></li>		<li><a class="three-stars" star:value="3" href="#">3</a></li>		<li><a class="four-stars" star:value="4" href="#">4</a></li>		<li><a class="five-stars" star:value="5" href="#">5</a></li>	</ul>	<span class="result" id="stars4-tips"></span>    <input type="hidden" id="stars4-input" name="b" value="" size="2" /></div><div class="shop-rating">	<span class="title">物流公司的服务:</span>	<ul class="rating-level" id="stars5">		<li><a class="one-star" star:value="20" href="#">20</a></li>		<li><a class="two-stars" star:value="40" href="#">40</a></li>		<li><a class="three-stars" star:value="60" href="#">60</a></li>		<li><a class="four-stars" star:value="80" href="#">80</a></li>		<li><a class="five-stars" star:value="100" href="#">100</a></li>	</ul>	<span class="result" id="stars5-tips"></span>	<input type="hidden" id="stars5-input" name="b" value="" size="2" /></div><!-- END 星级评分 --><input type="button" value="test" onclick="teststars()" /><script type="text/javascript">var Class = {	create: function() {		return function() { this.initialize.apply(this, arguments); }	}}var Extend = function(destination, source) {	for (var property in source) {		destination[property] = source[property];	}}function stopDefault( e ) {	 if ( e && e.preventDefault ){		e.preventDefault();	}else{		window.event.returnValue = false;	}	return false;} /** * 星星打分组件 * * @author	Yunsd * @date	2010-7-5 */var Stars = Class.create();Stars.prototype = {	initialize: function(star,options) {		this.SetOptions(options); //默认属性		var flag = 999; //定义全局指针		var isIE = (document.all) ? true : false; //IE?		var starlist = document.getElementById(star).getElementsByTagName('a'); //星星列表		var input = document.getElementById(this.options.Input) || document.getElementById(star+"-input"); // 输出结果		var tips = document.getElementById(this.options.Tips) || document.getElementById(star+"-tips"); // 打印提示		var nowClass = " " + this.options.nowClass; // 定义选中星星样式名		var tipsTxt = this.options.tipsTxt; // 定义提示文案		var len = starlist.length; //星星数量				for(i=0;i<len;i++){ // 绑定事件 点击 鼠标滑过			starlist[i].value = i;			starlist[i].onclick = function(e){				stopDefault(e);				this.className = this.className + nowClass;				flag = this.value;				input.value = this.getAttribute("star:value");				tips.innerHTML = tipsTxt[this.value]			}			starlist[i].onmouseover = function(){				if (flag< 999){					var reg = RegExp(nowClass,"g");					starlist[flag].className = starlist[flag].className.replace(reg,"")				}			}			starlist[i].onmouseout = function(){				if (flag< 999){					starlist[flag].className = starlist[flag].className + nowClass;				}			}		};		if (isIE){ //FIX IE下样式错误			var li = document.getElementById(star).getElementsByTagName('li');			for (var i = 0, len = li.length; i < len; i++) {				var c = li[i];				if (c) {					c.className = c.getElementsByTagName('a')[0].className;				}			}		}	},	//设置默认属性	SetOptions: function(options) {		this.options = {//默认值			Input:			"",//设置触保存分数的INPUT			Tips:			"",//设置提示文案容器			nowClass:	"current-rating",//选中的样式名			tipsTxt:		["1分-严重不合格","2分-不合格","3分-合格","4分-优秀","5分-完美"]//提示文案		};		Extend(this.options, options || {});	}}/* For TEST */function teststars(){	alert('卖家服务的态度:'+document.getElementById("stars1-input").value+'分.\n宝贝与描述相符:'+document.getElementById("stars2-input").value+'分.\n卖家发货速度:'+document.getElementById("stars3-input").value+'分.\n物流公司速度:'+document.getElementById("stars4-input").value+'分.\n物流公司态度:'+document.getElementById("stars5-input").value+'分.');}var Stars1 = new Stars("stars1")var Stars2 = new Stars("stars2");var Stars2 = new Stars("stars3");var Stars2 = new Stars("stars4",{nowClass:"current-rating",tipsTxt:["100分-严重不合格","200分-不合格","300分-合格","400分-优秀","500分-完美"]});var Stars2 = new Stars("stars5");</script> </body></html>
Salin selepas log masuk

  

PHP使用如下:

conn.php 链接数据库文件我就不写了。

<?php	$sell=mysql_query("select * from sjpj where sjid='$_GET[id]'");	$dian=mysql_fetch_array($sell);	$num=mysql_num_rows($sell);		if($num==0){			$fen=0;			$num=1;		}else{				$sq="select sum(fen) from sjpj  where sjid='$_GET[id]'";				$res=mysql_query($sq);				$row1=mysql_fetch_row($res);				$fen=$row1[0];		}	  $fen=$fen/$num;?>
Salin selepas log masuk

如果是多个的话可以直接加 sum() 

显示html文件:

<img  src="/static/imghw/default1.png"  data-src="images/space000.gif"  class="lazy" title="<?php echo  round($fen,1);? alt="PHP评分系统" >分" class="star level<?php echo round($fen);?>" />
Salin selepas log masuk

space000.gif(这个图片就是一个 1px的图片):
Salin selepas log masuk

  

css样式:

.star{	width:124px;	height:27px;	background: url(../images/stat.png) 0 0;	cursor:pointer;	position:relative;}.level0{background-position:-0px -0px;}.level1{background-position:0px -29px;}.level2{background-position:0px -58px;}.level3{background-position:0px -87px;}.level4{background-position:0px -116px;}.level5{background-position:0px -145px;}
Salin selepas log masuk

  

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Arahan sembang dan cara menggunakannya
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Jelaskan JSON Web Tokens (JWT) dan kes penggunaannya dalam PHP API. Jelaskan JSON Web Tokens (JWT) dan kes penggunaannya dalam PHP API. Apr 05, 2025 am 12:04 AM

JWT adalah standard terbuka berdasarkan JSON, yang digunakan untuk menghantar maklumat secara selamat antara pihak, terutamanya untuk pengesahan identiti dan pertukaran maklumat. 1. JWT terdiri daripada tiga bahagian: header, muatan dan tandatangan. 2. Prinsip kerja JWT termasuk tiga langkah: menjana JWT, mengesahkan JWT dan muatan parsing. 3. Apabila menggunakan JWT untuk pengesahan di PHP, JWT boleh dijana dan disahkan, dan peranan pengguna dan maklumat kebenaran boleh dimasukkan dalam penggunaan lanjutan. 4. Kesilapan umum termasuk kegagalan pengesahan tandatangan, tamat tempoh, dan muatan besar. Kemahiran penyahpepijatan termasuk menggunakan alat debugging dan pembalakan. 5. Pengoptimuman prestasi dan amalan terbaik termasuk menggunakan algoritma tandatangan yang sesuai, menetapkan tempoh kesahihan dengan munasabah,

Terangkan konsep pengikatan statik lewat dalam PHP. Terangkan konsep pengikatan statik lewat dalam PHP. Mar 21, 2025 pm 01:33 PM

Artikel membincangkan pengikatan statik lewat (LSB) dalam PHP, yang diperkenalkan dalam Php 5.3, yang membolehkan resolusi runtime kaedah statik memerlukan lebih banyak warisan yang fleksibel. Isu: LSB vs polimorfisme tradisional; Aplikasi Praktikal LSB dan Potensi Perfo

Huraikan prinsip -prinsip yang kukuh dan bagaimana ia memohon kepada pembangunan PHP. Huraikan prinsip -prinsip yang kukuh dan bagaimana ia memohon kepada pembangunan PHP. Apr 03, 2025 am 12:04 AM

Penerapan prinsip pepejal dalam pembangunan PHP termasuk: 1. Prinsip Tanggungjawab Tunggal (SRP): Setiap kelas bertanggungjawab untuk hanya satu fungsi. 2. Prinsip Terbuka dan Tutup (OCP): Perubahan dicapai melalui lanjutan dan bukannya pengubahsuaian. 3. Prinsip Penggantian Lisch (LSP): Subkelas boleh menggantikan kelas asas tanpa menjejaskan ketepatan program. 4. Prinsip Pengasingan Antara Muka (ISP): Gunakan antara muka halus untuk mengelakkan kebergantungan dan kaedah yang tidak digunakan. 5. Prinsip Inversi Ketergantungan (DIP): Modul peringkat tinggi dan rendah bergantung kepada abstraksi dan dilaksanakan melalui suntikan ketergantungan.

Ciri -ciri Keselamatan Rangka Kerja: Melindungi Kelemahan. Ciri -ciri Keselamatan Rangka Kerja: Melindungi Kelemahan. Mar 28, 2025 pm 05:11 PM

Artikel membincangkan ciri -ciri keselamatan penting dalam rangka kerja untuk melindungi daripada kelemahan, termasuk pengesahan input, pengesahan, dan kemas kini tetap.

Menyesuaikan/Memperluas Rangka Kerja: Cara Menambah Fungsi Custom. Menyesuaikan/Memperluas Rangka Kerja: Cara Menambah Fungsi Custom. Mar 28, 2025 pm 05:12 PM

Artikel ini membincangkan menambah fungsi khusus kepada kerangka kerja, memberi tumpuan kepada pemahaman seni bina, mengenal pasti titik lanjutan, dan amalan terbaik untuk integrasi dan debugging.

Bagaimana cara menghantar permintaan pos yang mengandungi data JSON menggunakan perpustakaan php curl? Bagaimana cara menghantar permintaan pos yang mengandungi data JSON menggunakan perpustakaan php curl? Apr 01, 2025 pm 03:12 PM

Menghantar data JSON menggunakan perpustakaan Curl PHP dalam pembangunan PHP, sering kali perlu berinteraksi dengan API luaran. Salah satu cara biasa ialah menggunakan perpustakaan curl untuk menghantar post ...

Bagaimana cara menetapkan kebenaran secara automatik UnixSocket selepas sistem dimulakan semula? Bagaimana cara menetapkan kebenaran secara automatik UnixSocket selepas sistem dimulakan semula? Mar 31, 2025 pm 11:54 PM

Bagaimana untuk menetapkan keizinan UnixSocket secara automatik selepas sistem dimulakan semula. Setiap kali sistem dimulakan semula, kita perlu melaksanakan perintah berikut untuk mengubahsuai keizinan UnixSocket: sudo ...

See all articles