jQuery用戶界面的星級小工具

我被介紹給用於jQuery UI的Star Rating widget。我最初使用的是this one。jQuery用戶界面的星級小工具

使用兩者有什麼區別嗎？

那麼試圖使用jQuery UI的一個，我不能讓輸入按鈕顯示爲星星。我有這些JS和CSS包括文件：

<script src="jquery-1.3.2.min.js" type="text/javascript"></script> 
<script src="jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script> 
<script src="ui.stars.js" type="text/javascript"></script> 
<link href="ui.stars.css" type="text/css" rel="stylesheet" />

而對於我的代碼，簡單地說：

<form> 
    Rating: <span id="stars-cap"></span> 
    <div id="stars-wrapper1"> 
     <input type="radio" name="newrate" value="1" title="Very poor" /> 
     <input type="radio" name="newrate" value="2" title="Poor" /> 
     <input type="radio" name="newrate" value="3" title="Not that bad" /> 
     <input type="radio" name="newrate" value="4" title="Fair" /> 
     <input type="radio" name="newrate" value="5" title="Average" checked="checked" /> 
     <input type="radio" name="newrate" value="6" title="Almost good" /> 
     <input type="radio" name="newrate" value="7" title="Good" /> 
     <input type="radio" name="newrate" value="8" title="Very good" /> 
     <input type="radio" name="newrate" value="9" title="Excellent" /> 
     <input type="radio" name="newrate" value="10" title="Perfect" /> 
    </div> 
</form>

的所有文件和圖像在同一文件夾。我以前從未使用jQuery UI，所以我不確定是否需要的只是該文件。我不確定它是否也需要它，我使用的另一個星級評分插件並不需要它。任何人都知道我失去了什麼？

來源

2009-10-11 Roger

通常jquery ui css文件引用來自文件夾名爲images的圖片放置爲與css文件相同的目錄。所以你需要改變ui.stars.js中引用圖像的路徑。

| 
    --images 
    | 
    ---image files are here 
    | 
    --ui.stars.css

來源

2009-10-11 16:52:58 TheVillageIdiot

奇怪，我創建的映像文件夾，並把ui.stars.gif內但仍然沒有運氣。 – Roger 2009-10-11 17:05:18

當使用orkans' STAR_RATING你需要告訴它單選按鈕轉換爲星明確，像這樣（我使用jQuery.noConflict模式）：

jQuery(document).ready(function($){ 
    $("#stars-wrapper1").stars(); 
}

來源

2009-12-15 14:36:18

我發現，這個問題與我已經下載的版本是，該對象o在_init函數中沒有初始化好（ui.star.js結尾的默認值未加載）。該對象還設置了CSS值（類）。我還沒有找到解決辦法，但一個簡單的解決方法是，在您的網頁上星初始化填補這些值：

<script type="text/javascript"> 
    $("#stars-wrapper1").stars({ 
    cancelClass: "ui-stars-cancel", 
    starClass: "ui-stars-star", 
    starOnClass: "ui-stars-star-on", 
    starHoverClass: "ui-stars-star-hover", 
    starDisabledClass: "ui-stars-star-disabled", 
    cancelHoverClass: "ui-stars-cancel-hover", 
    cancelDisabledClass: "ui-stars-cancel-disabled" 
    }); 
    </script>

來源

2010-04-03 00:26:26

jQuery用戶界面的星級小工具

回答

相關問題