Question

我尝试了rateit plugin，但这似乎与<option selected="selected">

无法正常工作

更新：将JSfiddle更新为最新的jquery，现在我回到了问题，当我在select中有5个选项时它只显示4颗星？

我一直在寻找几个小时来找到一个评级插件：

不需要额外的HTML。
使用title属性显示每个悬停时的选项文本。
仅适用于全星评级。

HTML

<select class="test" id="rating1" name="Rating">
    <option value="1">Poor</option>
    <option value="2">Fair</option>
    <option value="3" selected="selected">Good</option>
    <option value="4">Very Good</option>
    <option value="5">Excellent</option>
</select>

Answer 1

您需要让selectbox更新评级值。添加：

$('#rating1').change(function() {
  $('div#rating2').rateit('value',$(this).val());
});

请参阅example。

修改

RateIt需要jQuery 1.6.0+，这就是为什么更新jQuery版本会导致selectbox（正确）消失。查看this fiddle，了解它是否符合您的需求。这将“逐步增强”选择框，这样没有启用JavaScript的用户仍然可以使用select，而启用了JS的用户将获得更好的版本。

如果您希望显示支持字段，则必须在rateit()调用后切换它。另外，为了防止显示“重置”选项，您需要设置另一个数据属性并稍微扩展选择：

Example

Answer 2

您的jQuery版本已经过时，您需要1.6或更新版本。

jQuery评级插件，适用于选择选项

2 个答案: