jquery - 从数据库获取数据到5星评级

我正在使用此模板在用户旁边显示评分。

{insert name=get_percent value=a assign=mpercent userid=$p.USERID}

  {if $mpercent ne ""}
    <div class='user-rate'>
      rate<span class='green'>{$mpercent}&#37;</span>
    </div>

  {else}
    <div class='user-rate'>not rated yet</div>
  {/if}

我想将评分从百分比值更改为星级（0-5）。

我在this link中尝试了答案

这是我添加以下CSS的代码：

span.stars, span.stars span {
  display: block;
  background:url(../images/stars.png) 0 -16px repeat-x;
  width: 80px;
  height: 16px;
}

span.stars span {
  background-position: 0 0;
}

和JavaScript：

$(function() {
  $("span.stars").stars();
});

$.fn.stars = function() {
  return $(this).each(function() {
    $(this).html($('<span />')
      .width(Math.max(0, (Math.min(5, parseFloat($(this).html())))) * 16));
  });
}

并将其用于每个等级：

<p> <span class="stars">{$mpercent}</span>    </p>

我使用{$mpercent}来获得会员的评价，但结果是我一直都获得5星。

如果将span class的值更改为固定数字（让我们说1,2或3），我也会得到相同的结果。

最佳答案

两点：


明确链接的代码表明，您需要确保该值在0到5之间。因此，使用0-100表示​​5-100表示​​5。您需要使用($mpercent/100)*5转换为0-5范围。
通过将jQuery插件压缩为一行，您不必要地难以阅读代码。


但是，该代码看起来正确。我建议您将值更改为0到5之间，然后仔细检查它仍然始终显示5 *。请注意，此代码仅在加载DOM时运行，因此，如果您使用chrome开发人员工具或类似工具更改跨度的内容，则不能期望星级会自动更新。

关于jquery - 从数据库获取数据到5星评级，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19611307/