js改变评论的效果

huxiuliang

浏览: 118931 次
性别:
来自: 北京

最近访客更多访客>>

tanghui

dongguangming88

lzx7788120

richand730

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

JavaScript

JavaScript XHTML CSS HTML

<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">

</style>
</head>
<script>
var sArray = new Object;
    sArray[0] = new Image;
    sArray[0].src = "icon_star_1.gif";
    for (var i=1; i<6; i++) {
        sArray[i] = new Image();
        sArray[i].src = "icon_star_2.gif";
    }

    var pro ;
    var rate ;
    function initStar() {

        try {
            setProfix("fuwu_");
            setStars(document.getElementById("fuwu").value,'fuwu');
            setProfix("zl_");
            setStars(document.getElementById("zl").value,'zl');
            setProfix("xjb_");
            setStars(document.getElementById("xjb").value,'xjb');
            setProfix("hj_");
            setStars(document.getElementById("hj").value,'hj');

        } catch(e){

        }
    }

    function showStars(starNum,rate) {
    try {

        greyStars();
        colorStars(starNum);
        } catch(e){}
        //setStars(starNum,rate);

    }
    function setProfix(profix) {
        pro = profix ;
    }
    function colorStars(starNum) {
        try {
            for (var i=1; i <= starNum; i++) {
                var tmpStar = document.getElementById(pro + i);
                tmpStar.src = sArray[starNum].src;
            }
        } catch(e){}
    }
    function greyStars() {
        try {
            for (var i=1; i<6; i++) {
                var tmpStar = document.getElementById(pro + i);
                tmpStar.src = sArray[0].src;
            }
        } catch(e){}
    }

    function greyAll(curpro,currate) {
        try {
            document.getElementById(currate).value ="";
            for (var i=1; i<6; i++) {
                var tmpStar = document.getElementById(curpro + i);
                tmpStar.src = sArray[0].src;
            }
        } catch(e){}
    }

    function setStars(starNum,rate) {
        rate = rate ;
        try {

            var fuwu = document.getElementById(rate);
            fuwu.value = starNum;
            showStars(starNum);
            } catch(e){}
    }

    function clearStars(currate) {
        rate = currate ;
        try {
            var fuwu = document.getElementById(rate);
            if (fuwu.value != '') {
                setStars(fuwu.value,rate);
            } else {
                greyStars();
            }
        } catch(e){}
    }

    function resetStars() {
        try {

            var fuwu = document.getElementById(rate);
            if (fuwu.value != '') {
                setStars(fuwu.value,rate);
            } else {
                greyStars();
            }
        } catch(e){}
    }



</script>
<body>
<ul class="Star">
     <li>
         <span class="number">*</span>服务
             <span class="Select">
                 <a onmouseover="javascript:setProfix('fuwu_');showStars(1,'fuwu');" onmouseout="javascript:setProfix('fuwu_');clearStars('fuwu');" href="javascript:setProfix('fuwu_');setStars(1,'fuwu');"><img id="fuwu_1" title="差(1)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('star_');showStars(2,'fuwu');" onmouseout="javascript:setProfix('fuwu_');clearStars('fuwu');" href="javascript:setProfix('fuwu_');setStars(2,'fuwu');"><img id="fuwu_2" title="一般(2)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('star_');showStars(3,'fuwu');" onmouseout="javascript:setProfix('fuwu_');clearStars('fuwu');" href="javascript:setProfix('fuwu_');setStars(3,'fuwu');"><img id="fuwu_3" title="好(3)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('star_');showStars(4,'fuwu');" onmouseout="javascript:setProfix('fuwu_');clearStars('fuwu');" href="javascript:setProfix('fuwu_');setStars(4,'fuwu');"><img id="fuwu_4" title="很好(4)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('star_');showStars(5,'fuwu');" onmouseout="javascript:setProfix('fuwu_');clearStars('fuwu');" href="javascript:setProfix('fuwu_');setStars(5,'fuwu');"><img id="fuwu_5" title="非常好(5)" src="icon_star_1.gif"></a>
           </span>
     </li>

<li>
    <span class="number">*</span>质量
          <span class="Select">
                 <a onmouseover="javascript:setProfix('zl_');showStars(1,'zl');" onmouseout="javascript:setProfix('zl_');clearStars('zl');" href="javascript:setProfix('zl_');setStars(1,'zl');"><img id="zl_1" title="差(1)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('zl_');showStars(2,'zl');" onmouseout="javascript:setProfix('zl_');clearStars('zl');" href="javascript:setProfix('zl_');setStars(2,'zl');"><img id="zl_2" title="一般(2)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('zl_');showStars(3,'zl');" onmouseout="javascript:setProfix('zl_');clearStars('zl');" href="javascript:setProfix('zl_');setStars(3,'zl');"><img id="zl_3" title="好(3)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('zl_');showStars(4,'zl');" onmouseout="javascript:setProfix('zl_');clearStars('zl');" href="javascript:setProfix('zl_');setStars(4,'zl');"><img id="zl_4" title="很好(4)" src="icon_star_1.gif"></a>
                 <a onmouseover="javascript:setProfix('zl_');showStars(5,'zl');" onmouseout="javascript:setProfix('zl_');clearStars('zl');" href="javascript:setProfix('zl_');setStars(5,'zl');"><img id="zl_5" title="非常好(5)" src="icon_star_1.gif"></a>
          </span>
    </li>
<li>
<span class="number">*</span>环境
<span class="Select">
          <a onmouseover="javascript:setProfix('hj_');showStars(1,'hj');" onmouseout="javascript:setProfix('hj_');clearStars('hj');" href="javascript:setProfix('hj_');setStars(1,'hj');"><img id="hj_1" title="差(1)" src="icon_star_1.gif"></a>
          <a onmouseover="javascript:setProfix('hj_');showStars(2,'hj');" onmouseout="javascript:setProfix('hj_');clearStars('hj');" href="javascript:setProfix('hj_');setStars(2,'hj');"><img id="hj_2" title="一般(2)" src="icon_star_1.gif"></a>
          <a onmouseover="javascript:setProfix('hj_');showStars(3,'hj');" onmouseout="javascript:setProfix('hj_');clearStars('hj');" href="javascript:setProfix('hj_');setStars(3,'hj');"><img id="hj_3" title="好(3)" src="icon_star_1.gif"></a>
          <a onmouseover="javascript:setProfix('hj_');showStars(4,'hj');" onmouseout="javascript:setProfix('hj_');clearStars('hj');" href="javascript:setProfix('hj_');setStars(4,'hj');"><img id="hj_4" title="很好(4)" src="icon_star_1.gif"></a>
          <a onmouseover="javascript:setProfix('hj_');showStars(5,'hj');" onmouseout="javascript:setProfix('hj_');clearStars('hj');" href="javascript:setProfix('hj_');setStars(5,'hj');"><img id="hj_5" title="非常好(5)" src="icon_star_1.gif"></a>
    </span>
    </li>

<li>
    <span class="number">*</span>性价比
       <span class="Select">
            <a onmouseover="javascript:setProfix('xjb_');showStars(1,'xjb');" onmouseout="javascript:setProfix('xjb_');clearStars('xjb');" href="javascript:setProfix('xjb_');setStars(1,'xjb');"><img id="xjb_1" title="差(1)" src="icon_star_1.gif"></a>
            <a onmouseover="javascript:setProfix('xjb_');showStars(2,'xjb');" onmouseout="javascript:setProfix('xjb_');clearStars('xjb');" href="javascript:setProfix('xjb_');setStars(2,'xjb');"><img id="xjb_2" title="一般(2)" src="icon_star_1.gif"></a>
            <a onmouseover="javascript:setProfix('xjb_');showStars(3,'xjb');" onmouseout="javascript:setProfix('xjb_');clearStars('xjb');" href="javascript:setProfix('xjb_');setStars(3,'xjb');"><img id="xjb_3" title="好(3)" src="icon_star_1.gif"></a>
            <a onmouseover="javascript:setProfix('xjb_');showStars(4,'xjb');" onmouseout="javascript:setProfix('xjb_');clearStars('xjb');" href="javascript:setProfix('xjb_');setStars(4,'xjb');"><img id="xjb_4" title="很好(4)" src="icon_star_1.gif"></a>
            <a onmouseover="javascript:setProfix('xjb_');showStars(5,'xjb');" onmouseout="javascript:setProfix('xjb_');clearStars('xjb');" href="javascript:setProfix('xjb_');setStars(5,'xjb');"><img id="xjb_5" title="非常好(5)" src="icon_star_1.gif"></a>
       </span>
   </li>

</ul>
        <input id="fuwu" name="fuwu" value="4" type="text">
        <input id="zl" name="zl" value="" type="text">

        <input id="hj" name="hj" value="" type="text">
        <input id="xjb" name="xjb" value="" type="text">

        <script>
            initStar();
        </script>
</body>
</html>

pinglun.rar (2.1 KB)
下载次数: 8

分享到：

ftp软件 | js对字符串，数组的操作

2008-08-18 13:35
浏览 1074
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论