如何在星级评分插件中制作工作工具提示插件

Question

我使用了this star rating plugin。如果将鼠标悬停在每个星形图标上，则会显示默认工具提示。我想使用此tooltip而不是默认的工具提示。我已经把所有必要的文件放到这样的HTML中了：

<input class="hover-star tooltip" type="radio" name="rating-1" value="3" title="OK"/>

但是，似乎工具提示无法在该评级插件中运行。我不擅长javascript。这就是为什么，我不明白我应该在哪里修改以使工具提示正常工作。我该怎么做？这是my fiddle work

Answer 1

评级插件会更改您的标记（它会在您的标题中添加＆lt; a＆gt;标记）。所以只需按照以下方式调整选择器：

$('.tooltip a').tooltipster({
    interactive: true,
    contentAsHTML: true,
});

见工作demo。

修改 由于＆lt; a＆gt;工具提示删除标签标题，您可以使用一个不同的选择器来获取工具提示文本：

...
focus: function(value, link){
  var tip = $('.hover-test');
  tip[0].data = tip[0].data || tip.html();
  tip.html($(link).parent().attr('aria-label') || 'value: '+value);
},
...

这不是很干净，但应该做好。查看更新的demo。