Question

我有一个Rails应用程序，我在其中使用jquery Raty插件我将gemy包含在gemfile中

gem 'jquery-raty-rails', github: 'bmc/jquery-raty-rails'

在application.js中我已经包含了

//= require jquery.raty
//= require jquery.raty.min

我把它包含在javascript中

  $('#star-log').raty({
    target     : '#hint-log',
    targetType : 'score',
    targetKeep : true
});
$('#star-comm').raty({
    target     : '#hint-comm',
    targetType : 'score',
    targetKeep : true
});
$('#star-tech').raty({
    target     : '#hint-tech',
    targetType : 'score',
    targetKeep : true

});
$('#star-overall').raty({
    target     : '#hint-overall',
    targetType : 'score',
    targetKeep : true,
    readOnly   : true
});

星级评定的视图为

<div class="row">
            <div class=" col s12 m6 logical">
              <label>Logical & Analytical Skills</label>
              <div id="star-log" > </div>
              <%= f.text_field :log_skill, :id=>'hint-log' %>

            </div>
            <div class=" col s12 m6">
              <label>Communication skills</label>
              <div id="star-comm" ></div>
              <%= f.text_field :comm_skill, :id=>'hint-comm' %>
            </div>
          </div>
                <div class="row">
                  <div class=" col s12 m6">
                    <label>Technical Skills</label>
                    <div id="star-tech" id="star-tech"></div>
                    <%= f.text_field :log_skill, :id=>'hint-tech' %>
                  </div>
                  <div class="col s12 m6">
                    <label >Overall Rating</label>
                    <div id="star-overall" id="star-read"></div>
                    <%= f.text_field :log_skill, :id=>'hint-overall' %>
                  </div>
                </div>

我有4个星级评分为

逻辑＆amp;分析技巧
沟通技巧
技术技能
整体技能

所以现在用户将评分的前三星级费率和那些评级的整体技能（只读）将在评级时更新，或者我们可以说整体技能等级将是前三种技能的平均值，它将会自动更新并继续显示星星我怎么能这样做？

Answer 1

将星级星级添加到星级评分的第3组

<div class="row">
  <div class=" col s12 m6 logical">
    <label>Logical & Analytical Skills</label>
    <div id="star-log" class="stars" > </div>
    <%= f.text_field :log_skill, :id=>'hint-log' %>
  </div>

  <div class=" col s12 m6">
    <label>Communication skills</label>
    <div id="star-comm" class="stars" ></div>
    <%= f.text_field :comm_skill, :id=>'hint-comm' %>
  </div>
</div>
<div class="row">
  <div class=" col s12 m6">
    <label>Technical Skills</label>
    <div id="star-tech" class="stars"></div>
    <%= f.text_field :log_skill, :id=>'hint-tech' %>
  </div>
  <div class="col s12 m6">
    <label >Overall Rating</label>
    <div id="star-overall"></div>
    <%= f.text_field :log_skill, :id=>'hint-overall' %>
  </div>
</div>

删除了给予最后星级评分的双重身份证明（明星技术和overvall）

$('#star-log').raty({
    target     : '#hint-log',
    targetType : 'score',
    targetKeep : true
});

$('#star-comm').raty({
    target     : '#hint-comm',
    targetType : 'score',
    targetKeep : true
});

$('#star-tech').raty({
    target     : '#hint-tech',
    targetType : 'score',
    targetKeep : true

});

$('#star-overall').raty({
    target     : '#hint-overall',
    targetType : 'score',
    targetKeep : true,
    readOnly   : true
});

$(document).on("click", ".stars", function(){
  var score = 0 ;

  //loop through stars to get score
  $('.stars').each(function(i, obj) {
    //if score is there will be undefined if star not selected
    if ($(obj).raty('score')) 
      score +=  $(obj).raty('score'); 
  });
 //calculating average
 score = score / $(".stars").length;
 $('#star-overall').raty({score:  score });
 $("#hint-overall").val(score.toFixed(2));
});

在Rails 4中使用Jquery Raty并显示星级的平均值

1 个答案: