2011-08-16 2 views
0

나는 JS와 jQuery에 영리 해지기 위해, 'Raty'라는 3PP를 사용하여 별표를 div에 넣는 방식으로 항목에 주어진 등급이 무엇인지 보여주고 싶을 때 유용합니다.숨겨진 필드가 달리 지시 할 때 평점이 항상 최대 평점을 표시하는 이유는 무엇입니까?

지금, 여기에 내가 동적으로 값을 할당하는 데 사용하는 자바 스크립트입니다 :

$(document).ready(function() { 
for (var i = 1; i <=5; i++) { 
    var starting = parseInt($('#toplistRating'+i+'val').val()); 
    $('#toplistRating'+i).raty({ 
     number: 3, 
     half: true, 
     readOnly: true, 
     start: starting, 
     hintList: ['could be improved', 'alright', 'AWESOME'] 
    }); 
} 

}); 

그리고이 DB에서 얻을 항목의 목록이 있습니다. 다음은 모든 (5) (일부 IDS는 1과 상이한 바, 그들은 본질적으로 동일 주) : - http://www.wbotelhos.com/raty/ -

<div id="toplist" class="std-column"> 

     <p class="toplist-links">switch to top: <a href="index?toplistSelected=1">1</a> | <a href="index?toplistSelected=2">2</a> 
      <a href="index?toplistSelected=3">3</a> | <a href="index?toplistSelected=4">4</a></p> 

      <div class="toplist-item"> 
       <a href="viewpic?id=35"> 
       <p class="toplist-num">1.</p> 
        <img src="image?id=35&amp;thumbnail=1" class="toplist-pic"> 
        <div class="toplist-info"> 
         <div id="toplistRating1" style="cursor: default;" title="AWESOME"><img class="toplistRating1" title="AWESOME" alt="1" src="images/star-on.png" id="toplistRating1-1">&nbsp;<img class="toplistRating1" title="AWESOME" alt="2" src="images/star-on.png" id="toplistRating1-2">&nbsp;<img class="toplistRating1" title="AWESOME" alt="3" src="images/star-on.png" id="toplistRating1-3"><input type="hidden" id="toplistRating1-score" name="score" value="3"></div> 
         <input type="hidden" value="6" id="toplistRating1val"> 
         <p class="toplist-text"><span class="soft">1 ratings</span></p> 
        </div> 
       </a> 
      </div> 

      <div class="toplist-item"> 
       <a href="viewpic?id=7"> 
       <p class="toplist-num">2.</p> 
        <img src="image?id=7&amp;thumbnail=1" class="toplist-pic"> 
        <div class="toplist-info"> 
         <div id="toplistRating2" style="cursor: default;" title="AWESOME"><img class="toplistRating2" title="AWESOME" alt="1" src="images/star-on.png" id="toplistRating2-1">&nbsp;<img class="toplistRating2" title="AWESOME" alt="2" src="images/star-on.png" id="toplistRating2-2">&nbsp;<img class="toplistRating2" title="AWESOME" alt="3" src="images/star-on.png" id="toplistRating2-3"><input type="hidden" id="toplistRating2-score" name="score" value="3"></div> 
         <input type="hidden" value="5" id="toplistRating2val"> 
         <p class="toplist-text"><span class="soft">3 ratings</span></p> 
        </div> 
       </a> 
      </div> 

      <div class="toplist-item"> 
       <a href="viewpic?id=11"> 
       <p class="toplist-num">3.</p> 
        <img src="image?id=11&amp;thumbnail=1" class="toplist-pic"> 
        <div class="toplist-info"> 
         <div id="toplistRating3" style="cursor: default;" title="AWESOME"><img class="toplistRating3" title="AWESOME" alt="1" src="images/star-on.png" id="toplistRating3-1">&nbsp;<img class="toplistRating3" title="AWESOME" alt="2" src="images/star-on.png" id="toplistRating3-2">&nbsp;<img class="toplistRating3" title="AWESOME" alt="3" src="images/star-on.png" id="toplistRating3-3"><input type="hidden" id="toplistRating3-score" name="score" value="3"></div> 
         <input type="hidden" value="5" id="toplistRating3val"> 
         <p class="toplist-text"><span class="soft">5 ratings</span></p> 
        </div> 
       </a> 
      </div> 

      <div class="toplist-item"> 
       <a href="viewpic?id=8"> 
       <p class="toplist-num">4.</p> 
        <img src="image?id=8&amp;thumbnail=1" class="toplist-pic"> 
        <div class="toplist-info"> 
         <div id="toplistRating4" style="cursor: default;" title="AWESOME"><img class="toplistRating4" title="AWESOME" alt="1" src="images/star-on.png" id="toplistRating4-1">&nbsp;<img class="toplistRating4" title="AWESOME" alt="2" src="images/star-on.png" id="toplistRating4-2">&nbsp;<img class="toplistRating4" title="AWESOME" alt="3" src="images/star-on.png" id="toplistRating4-3"><input type="hidden" id="toplistRating4-score" name="score" value="3"></div> 
         <input type="hidden" value="4" id="toplistRating4val"> 
         <p class="toplist-text"><span class="soft">5 ratings</span></p> 
        </div> 
       </a> 
      </div> 

      <div class="toplist-item"> 
       <a href="viewpic?id=12"> 
       <p class="toplist-num">5.</p> 
        <img src="image?id=12&amp;thumbnail=1" class="toplist-pic"> 
        <div class="toplist-info"> 
         <div id="toplistRating5" style="cursor: default;" title="AWESOME"><img class="toplistRating5" title="AWESOME" alt="1" src="images/star-on.png" id="toplistRating5-1">&nbsp;<img class="toplistRating5" title="AWESOME" alt="2" src="images/star-on.png" id="toplistRating5-2">&nbsp;<img class="toplistRating5" title="AWESOME" alt="3" src="images/star-on.png" id="toplistRating5-3"><input type="hidden" id="toplistRating5-score" name="score" value="3"></div> 
         <input type="hidden" value="4" id="toplistRating5val"> 
         <p class="toplist-text"><span class="soft">5 ratings</span></p> 
        </div> 
       </a> 
      </div> 

    </div> 

Raty 나는 것을 알 때에 만, 모든 항목 (3 점 만점) 3 별을 보여줍니다 지난 2 시간 동안 별 2 개처럼 점수가 낮습니다.

도와주세요. 나는 나의 문제가 자바 스크립트의 용의주한 사용, 특히 for-loop에 있다고 생각한다. 더 많은 정보가 필요하시면 알려주세요. 질문을 수정하겠습니다.

+0

각 항목에 대해 시작 값이 무엇인지 확인 했습니까? 이것이 항상 3이면 문제가 될 수 있습니다. – Fermin

+0

** 여기 실제 문제는 무엇입니까? ** ** A ** 잘못된 질문 표시 (질문에서 알 수 있듯이) 또는 ** B ** jQuery 선택자가 작동하지 않습니다 (질문 제목을 이해함)? 첫 번째 질문 일 경우 질문의 제목을 변경해야합니다. –

+0

@ 로버트, 내가 본 마지막 HTML이 없었습니다! 그게 그의 문제 같아. 항상 3 ~ 4 사이입니다. – Fermin

답변

4

시작 값은 div의 숨겨진 입력 필드에서 가져옵니다. 샘플 HTML에서이 값은 모두 3보다 큽니다. 언급 된 네 가지 항목에 대해

6, 5, 5, 4입니다.

별 범위이므로 최대 값은 3입니다.

숨겨진 입력 필드의 값을 < = 3으로 변경하면 다른 별 이미지가 표시됩니다.

반쪽 별을 포함 시키려면 parseInt 대신에 /2.0 이후에 parseFloat를 사용하십시오.

+1

+1 2로 나누면 아마 그가 잊어 버린 것이 될 것입니다. –

+0

그 점은 고마워요, 그게 내가 잊어 버린 것입니다! –

관련 문제