jQuery rateYo 插件在评级星点击后继续评级？答案

【问题标题】：jQuery rateYo plugin that continue rating after rated star click?jQuery rateYo 插件在评级星点击后继续评级？
【发布时间】：2015-05-21 21:53:10
【问题描述】：

我试过了，但我没有解决名为rateYo的完美jquery插件的问题。

我在这个页面上准备了一个示例：

http://jsfiddle.net/a1oewfwn/

$(".rateYo").rateYo({
  onSet: function(rating, rateYoInstance) {
    $(this).next().val(rating);
  },
  rating: 0,
  starWidth: "20px",
  numStars: 5,
  fullStar: true
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://rateyo.fundoocode.ninja/bower_components/jquery-rateyo/min/jquery.rateyo.min.css" />
<script src="http://rateyo.fundoocode.ninja/bower_components/jquery-rateyo/min/jquery.rateyo.min.js"></script>
<div class="rateYo" id="a1"></div>
<input type="text" id="t1">
<div class="rateYo" id="a2"></div>
<input type="text" id="t2">
<div class="rateYo" id="a3"></div>
<input type="text" id="t3">

如果您点击任何星星，假设您点击了第 2 行中的第 3 颗星星，当您将鼠标从第 1 行移到第 5 颗时，它会将所有三行固定为第 3 颗星星。

我想实现，所有三行都固定到最后一个选择。

我该如何解决这个问题？

【问题讨论】：

这是一个错误，我将尝试在下一个版本之前修复它 - 感谢您指出。

标签： javascript jquery rate

【解决方案1】：

单独设置插件似乎可以工作

$(".rateYo").each(function (e) {
    $(this).rateYo({
        onSet: function (rating, rateYoInstance) {
            $(this).next().val(rating);
        },
        rating: 0,
        starWidth: "20px",
        numStars: 5,
        fullStar: true
    });
});

$(".rateYo").each(function(e) {
      $(this).rateYo({
        onSet: function(rating, rateYoInstance) {
          $(this).next().val(rating);
        },
        rating: 0,
        starWidth: "20px",
        numStars: 5,
        fullStar: true
      });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://rateyo.fundoocode.ninja/bower_components/jquery-rateyo/min/jquery.rateyo.min.css" />
<script src="http://rateyo.fundoocode.ninja/bower_components/jquery-rateyo/min/jquery.rateyo.min.js"></script>
<div class="rateYo" id="a1"></div>
<input type="text" id="t1">
<div class="rateYo" id="a2"></div>
<input type="text" id="t2">
<div class="rateYo" id="a3"></div>
<input type="text" id="t3">

【讨论】：

【解决方案2】：

使用属性。 只读：真

【讨论】：