[jQuery] 별점 On/Off 해보기

 

 

5개의 별점을 on/off  하려고 하는데, 각각의 별마다 id값을 부여하고 attr  속성으로  class  명을 바꾸어서 처리하였다.

 

<h3 class="common">플래너의 별점을 남겨주세요.</h3>
<ul>
    <li><i class="fa-regular fa-star fa-star1" id="start1" onclick="startCheck('1')"></i></li>
    <li><i class="fa-regular fa-star fa-star2" id="start2" onclick="startCheck('2')"></i></li>
    <li><i class="fa-regular fa-star fa-star3" id="start3" onclick="startCheck('3')"></i></li>
    <li><i class="fa-regular fa-star fa-star4" id="start4" onclick="startCheck('4')"></i></li>
    <li><i class="fa-regular fa-star fa-star5" id="start5" onclick="startCheck('5')"></i></li>
</ul>
 
 
 
<script>
// 별점 on/off
function startCheck(num) {
    var inum = parseInt(num);
    for (i=1;i<=5;i++)
    {
        $("#start" + i).attr("class","fa-regular fa-star");
    }
    for (i=1;i<=inum;i++)
    {
        $("#start" + i).attr("class","fa-solid fa-star");
    }
}
</script>