Description:星星评分--鼠标移动高亮星星来评分，文字描述也对应改变。

KeyTech:无，熟悉Jquery

主要代码:

  1. var oContent =["极差", "很差", "一般" , "推荐" , "力荐"];/*定义评价数组*/
  2. var oDiv = document.getElementById("star");/*通过id获取div*/
  3. var oLi = oDiv.getElementsByTagName("li");/*通过标签获取li集合*/
  4. var oP = oDiv.getElementsByTagName("p")[0];/*通过标签索引获取div中的第1个p*/
  5. var i = 0;
  6. for(i=0;i<oLi.length;i++){
  7. oLi[i].index = i;
  8. /*功能一：鼠标经过，显示“评分&评价”*/
  9. oLi[i].onmouseover = function()
  10. {
  11. oP.style.display = "block";/*评价显示*/
  12. oP.innerHTML = oContent[this.index];/*评价内容动态修改*/
  13. for(i=0;i<=this.index;i++){
  14. oLi[i].className = "active";/*添加评分样式*/
  15. }
  16. }
  17. /*功能二：鼠标离开，隐藏“评分&评价”*/
  18. oLi[i].onmouseout = function()
  19. {
  20. oP.style.display = "none";/*评价隐藏*/
  21. for(i=0;i<=this.index;i++){
  22. oLi[i].className = "";/*清空评分样式*/
  23. }
  24. }
  25. /*功能三：鼠标单击，提示评分成功*/
  26. oLi[i].onclick = function()
  27. {
  28. alert("评论成功！！你的评分为："+(this.index+1)+"分");/*弹出提示“评分成功提示信息”*/
  29. }
  30. }