wex5中的星星評分

新建一個空白的.w文件，而後在頁面上放5個img星星圖片

重要的是圖片路徑不能是絕對路徑，要用相對路徑，否則js操做的時候會出bug

添加兩個label標籤（標籤隨你挑，在這我就用label）

你到時候能夠用他自帶的xid去控制，或者自定義一個id

接下來就是js部分

雙擊回跳轉到js部分，它就會自動建立一個click事件

下面就是操做源碼：

//    debugger;
        for(var i = 0;i <$("img").length;i++){
        
        // endsWith判斷字符的結尾是否與指定的字符串相匹配
        if($("img").eq(i).attr('src').endsWith("red.png")){
            $("img").eq(i).attr('src','img/star-yellow.png' );
        }
    }
    var index = event.currentTarget.dataset.index-0;
    for(var i = 0;i <=index;i++){
        $("img").eq(i).attr('src','img/star-red.png');
    }
    //index-0進行隱式轉換成number
     $("#score").text(index + 1 + '分').css;
     var x;
        switch (index){
            case 0:x=" (與賣家描述的嚴重不符，很是不滿)";
            break;
            case 1:x="(與賣家描述的不符，不滿意)";
            break;
            case 2:x="(沒有賣家描述的那麼好)";
            break;
            case 3:x="(與賣家描述的基本一致，仍是挺滿意的)";
            break;
            case 4:x="(與賣家描述的徹底一致，很是滿意)";
            break;
        }
        $("#s").text(x);

 最終效果