2011-05-09 52 views
3

我有以下選擇表單元素,並且我想將它應用到rateit jquery plugin將rateit jquery插件應用於選擇框

<select class="test" id="Rating" name="Rating"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
</select> 

,我試圖申請使用$("select.test").rateit();插件,但儘管fireQuery顯示數據連接的選擇元素,沒有效果是由我仍然留下了一個選擇框,而不是一條線的明星。

編輯

CSS文件您正在使用的插件錯誤包括

Here is the page in question

+1

您需要包含css文件。不工作仍然?需要看你的演示,這只是猜測沒有它的工作。 – 2011-05-09 10:20:16

+0

編輯答案以反映QES_form_edits.js中第 – 2011-05-09 10:42:21

回答

2

。見很簡單的例子:http://jsfiddle.net/rudiedirkx/ZuJ2k/

select有是有,但你還是要引用div當你調用插件:$('div#rating2').rateit();

然後div有到select與數據屬性的引用: data-rateit-backingfld="select#Rating"

編輯
其實它看起來像你不使用插件呢?你在哪裏打電話給插件?

編輯
這是你的代碼:

rateItDiv = $('<div class="rateit" data-rateit-backingfld="#Rating"></div>'); 
$("div#ReviewInputZone select.test").after(rateItDiv); 
$('div#rateit').rateit(); 

在最後一行,您引用div#rateit,但div不存在。您剛創建了div.rateit,而不是div#rateit。將其中任何一個更改爲另一個,並且它應該工作。我會保留#,因爲速度稍快(但您必須確保頁面上只有一個rateit下拉菜單)。

因此,新的第一行:

rateItDiv = $('<div id="rateit" class="rateit" data-rateit-backingfld="#Rating"></div>'); 

編輯
此外,您還可以測試它,你改變任何代碼之前。只需打開您的Javascript控制檯(FF中的Firebug或Chrome中的開發人員工具)並鍵入:jQuery('div.rateit').rateit();

+0

行,第197行 – 2011-05-09 11:03:37

+0

試圖進行這些更改,仍然沒有得到它! – 2011-05-09 11:04:10

+0

我編輯了我的答案。 – Rudie 2011-05-09 12:00:12