將rateit jquery插件應用於選擇框

Question

我有以下select表單元素，我想將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();來應用插件$("select.test").rateit(); ，但盡管fireQuery顯示數據附加了select元素，沒有效果，我仍然留下一個選擇框，而不是一行星。

編輯

包含CSS文件

這是有問題的頁面

Answer 1

你使用的插件錯了。 看一個非常簡單的例子： http ： //jsfiddle.net/rudiedirkx/ZuJ2k/

select必須在那里，但是你在調用插件時仍然需要引用div ： $('div#rating2').rateit();

然后div使用data屬性引用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 。 將其中任何一個更改為另一個，它應該工作。 我保留#因為它稍微快一些（但你必須確保頁面上只有一個這樣的速率下拉菜單）。

所以新的第一行：

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

編輯
此外，您可以在更改任何代碼之前對其進行測試。 只需打開您的Javascript控制台（FF中的Firebug或Chrome中的開發人員工具）並輸入： jQuery('div.rateit').rateit();