ホームページ  >  記事  >  ウェブフロントエンド  >  JSは星評価機能を実装します

JSは星評価機能を実装します

小云云
小云云オリジナル
2018-03-02 15:40:532330ブラウズ

この記事では主に星評価機能を実装するための JS について説明します。皆さんのお役に立てれば幸いです。

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>点亮星星评分</title></head><body  onload="test()"><table id ="czy">
    <tr>
        <td>★</td><td>★</td><td>★</td><td>★</td><td>★</td>
    </tr></table><input type="button" id="ok" value="打分"><script>
    tds=document.getElementsByTagName("td");    for(var i=0;i<tds.length;i++){
        tds[i].onmouseover=test;
    }    var index;    function  test(){

        for(var i=0;i<tds.length;i++){            if(tds[i]==this)
            {
                index=i;
            }
        }        for(var i=0;i<=index;i++) {
            tds[i].style.color = "red";
        }        for(var i=index+1;i<tds.length;i++){
            tds[i].style.color="black";
        }
    }
    document.getElementById("ok").onclick=function(){
        alert("评分:"+(index+1)+"分");
    }</script></body></html>

関連する推奨事項:

js 星評価を点灯し、parameters_javascript スキルを取得するための js コード

JavaScript で星評価効果を実装するためのコード共有

Taobao スターを実装するための jquery評価関数 Screenshot_jquery

以上がJSは星評価機能を実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。