老实说,我不知道我的问题是否与我使用的插件相关的jQuery有关。
我使用插件RateYo(http://prrashi.github.io/rateYo/)在我们的网站上显示星标。需要显示的星数在div的属性中给出:
<div id="rating-avg" class="rateyo" rating="<?php echo $avg_rating; ?>" preset="true"></div>
然后,我通过调用home.js调用插件RateYo,其中包含:
jQuery.noConflict()(function($){
$(document).ready(function() {
$(".rateYo").rateYo({
rating: $(this).attr('rating'),
readOnly: $(this).attr('preset')
});
});
});
不幸的是,这不起作用。该插件会启动并创建星标,但不使用变量$(this).attr(&#39; rating&#39;)和$(this).attr(&#39;预设&#39;)。不显示评级,而是显示空星。
当我使用以下代码时,评级会完美显示:
$("#rating-avg").rateYo({
rating: $("#rating-avg").attr("rating"),
readOnly: $("#rating-avg").attr("preset")
});
不幸的是,我需要插件才能按类启动,而不是id。我们在网站上有不同数量的评分,因此根据ID选择它们不是一个选项。
有人看到我做错了吗?
答案 0 :(得分:5)
您this
的值不正确,并且您使用的是错误的大写字母。你可以让它像这样工作:
$(".rateyo").each(function() {
var item = $(this);
item.rateYo({
rating: item.attr('rating'),
readOnly: item.attr('preset')
});
});
注意,您应该使用HTML5数据属性而不是自己的自定义属性:
<div id="rating-avg" class="rateyo" data-rating="<?php echo $avg_rating; ?>" data-preset="true"></div>
$(".rateyo").each(function() {
var item = $(this);
item.rateYo({
rating: item.data('rating'),
readOnly: item.data('preset')
});
});
答案 1 :(得分:1)
您在jQuery代码中引用rateYo
,而class属性包含rateyo
而没有大写'Y'。