& lt！doctype？html & gt
& lthtml & gt
& lthead & gt
& ltmeta？charset="utf-8 " >
& lttitle & gt無標題文檔
& lt劇本？type="text/javascript "？src = "/libs/jquery/1 . 6 . 4/jquery . js " >& lt/script & gt；
& lt/head & gt；
& ltbody & gt
& ltstyle & gt
*{?邊距:0；？填充:0；}
ul.stars{？顯示:塊；？保證金:100px？100px？30px？溢出:隱藏；}
ul.stars？李{？顯示:塊；？浮動:左；？填充:0？4px？光標:指針；}
ul.stars？李？img{？顯示:塊；？寬度:30px？高度:30px}
ul.stars？李？img.full{？顯示:無；}
ul.stars？李.昂？img.empty{？顯示:無；}
ul.stars？李.昂？img.full{？顯示:塊；}
& lt/style & gt；
& lt腳本& gt
$(文檔)。準備好了(功能(e)？{
$(“ul . stars？李”)。單擊(函數(){
$(這個)。toggle class(" on ")；
var？明星？=?$(“ul . stars”)。找(“李.上”)。size()；
$(“輸入#星”)。val(星星)；
});
});
& lt/script & gt；
& lt形式？method = " get " & gt
& ltul？class="stars " >
& lt李& gt
& ltimg？class= "空"？src = "/it/u = 38797779144025641504 & amp；fm = 26 & ampgp=0.jpg "？/& gt；
& ltimg？class= "滿"？src = "/p/20100131/20100131155623-694735656 . jpg "？/& gt；
& lt/李& gt
& lt李& gt
& ltimg？class= "空"？src = "/it/u = 38797779144025641504 & amp；fm = 26 & ampgp=0.jpg "？/& gt；
& ltimg？class= "滿"？src = "/p/20100131/20100131155623-694735656 . jpg "？/& gt；
& lt/李& gt
& lt李& gt
& ltimg？class= "空"？src = "/it/u = 38797779144025641504 & amp；fm = 26 & ampgp=0.jpg "？/& gt；
& ltimg？class= "滿"？src = "/p/20100131/20100131155623-694735656 . jpg "？/& gt；
& lt/李& gt
& lt李& gt
& ltimg？class= "空"？src = "/it/u = 38797779144025641504 & amp；fm = 26 & ampgp=0.jpg "？/& gt；
& ltimg？class= "滿"？src = "/p/20100131/20100131155623-694735656 . jpg "？/& gt；
& lt/李& gt
& lt李& gt
& ltimg？class= "空"？src = "/it/u = 38797779144025641504 & amp；fm = 26 & ampgp=0.jpg "？/& gt；
& ltimg？class= "滿"？src = "/p/20100131/20100131155623-694735656 . jpg "？/& gt；
& lt/李& gt
& lt/ul & gt；
& lt輸入？type="hidden "？id= "星星"？name="stars "？/& gt；
& lt輸入？type="submit "？Value= "提交"？style="margin:0？100 px；”& gt
& lt/form & gt；
& lt/body & gt；
& lt/html & gt；最好的辦法是把圖片當作ul的背景圖片，通過點擊li改變ul背景圖片的位置，得到索引值。無法上傳附件。。我們來編碼吧。。
& lt！DOCTYPE？HTML & gt
& lthtml & gt
& ltmeta？/libs/jquery/1 . 6 . 4/jquery . js " >& lt/script & gt；
& lt腳本& gt
$(文檔)。ready(function(){
//星級
$(“形式？p？span.radio？label.radio”)。單擊(函數(){
$(這個)。父代(" span.radio ")。css("背景-位置-y "，-($(這個)。index()* 19)+" px ")；
});
});
& lt/script & gt；
& ltstyle & gt
*{?邊距:0；？填充:0；}
形式？p{？顯示:塊；？溢出:隱藏；？填充:10px？20px}
形式？p？標簽{？顯示:塊；？高度:36px？行高:36px？顏色:# 444；？font-size:14px；？浮動:左；}
形式？p？span.radio{？顯示:塊；？寬度:150 px；？身高:19px；？背景:url(stars.png)？向左？0px？不重復；？浮動:左；？邊距:8px？0?0;}
形式？p？input.radio{？顯示:無；}
形式？p？label.radio{？寬度:20%；？身高:100%；？邊距:0；？光標:指針；}
形式？input.btn{？顯示:塊；？寬度:210px；？高度:36px？行高:36px？*行高:正常；？顏色:# fff？font-size:15px；？背景:# FFB 81f；？邊框:0；？邊框-半徑:6px？光標:指針；？浮動:左；？保證金-頂:10px；}
& lt/style & gt；
& ltbody & gt
& lt表單& gt
& ltp & gt
& lt標簽& gt服務態度:
& lt跨度？class="radio " >
& lt輸入？class= "收音機"？type="radio "？name="star1 "？value="0 "？檢查過了？/& gt；
& lt標簽？class= "收音機"？for="star11 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star12 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star13 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star14 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star15 " >& lt/label & gt；
& lt輸入？id="star11 "？class= "收音機"？type="radio "？name="star1 "？value="1 "？/& gt；
& lt輸入？id="star12 "？class= "收音機"？type="radio "？name="star1 "？value="2 "？/& gt；
& lt輸入？id="star13 "？class= "收音機"？type="radio "？name="star1 "？value="3 "？/& gt；
& lt輸入？id="star14 "？class= "收音機"？type="radio "？name="star1 "？value="4 "？/& gt；
& lt輸入？id="star15 "？class= "收音機"？type="radio "？name="star1 "？value="5 "？/& gt；
& lt/span>。
& lt/p & gt；
& ltp & gt
& lt標簽& gt運輸速度:
& lt跨度？class="radio " >
& lt輸入？class= "收音機"？type="radio "？name="star2 "？value="0 "？檢查過了？/& gt；
& lt標簽？class= "收音機"？for="star21 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star22 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star23 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star24 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star25 " >& lt/label & gt；
& lt輸入？id="star21 "？class= "收音機"？type="radio "？name="star2 "？value="1 "？/& gt；
& lt輸入？id="star22 "？class= "收音機"？type="radio "？name="star2 "？value="2 "？/& gt；
& lt輸入？id="star23 "？class= "收音機"？type="radio "？name="star2 "？value="3 "？/& gt；
& lt輸入？id="star24 "？class= "收音機"？type="radio "？name="star2 "？value="4 "？/& gt；
& lt輸入？id="star25 "？class= "收音機"？type="radio "？name="star2 "？value="5 "？/& gt；
& lt/span>。
& lt/p & gt；
& ltp & gt
& lt標簽& gt商品付款:
& lt跨度？class="radio " >
& lt輸入？class= "收音機"？type="radio "？name="star3 "？value="0 "？檢查過了？/& gt；
& lt標簽？class= "收音機"？for="star31 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star32 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star33 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star34 " >& lt/label & gt；
& lt標簽？class= "收音機"？for="star35 " >& lt/label & gt；
& lt輸入？id="star31 "？class= "收音機"？type="radio "？name="star3 "？value="1 "？/& gt；
& lt輸入？id="star32 "？class= "收音機"？type="radio "？name="star3 "？value="2 "？/& gt；
& lt輸入？id="star33 "？class= "收音機"？type="radio "？name="star3 "？value="3 "？/& gt；
& lt輸入？id="star34 "？class= "收音機"？type="radio "？name="star3 "？value="4 "？/& gt；
& lt輸入？id="star35 "？class= "收音機"？type="radio "？name="star3 "？value="5 "？/& gt；
& lt/span>。
& lt/p & gt；
& ltp & gt
& lt輸入？class="btn "？type="submit "？Value= "提交"？/& gt；
& lt/p & gt；
& lt/form & gt；
& lt/body & gt；
& lt/html & gt；附上圖片材料