Javascript

Question

预先感谢您的帮助。
我对 Javascript 不是很友好...

我有一个五星级评价系统，我正在尝试获取评分值（从 1 到 5）并将其推送到表单的隐藏输入中。

任何关于 "How to get the value on the 'XXXXX' space" 的信息将不胜感激。

谢谢:)

这是代码:)

var rating = {
 init: function() {
  var ratingWidth = $('.rating-select span').width();
  var step = ratingWidth / 5;

  $('.rating-select').mousemove(function(e) {
   var x = e.pageX -  $(this).offset().left;
   x = Math.ceil(x / step) * step;
   $('.rating-select span span').width(x);
   $(this).data('rating', x/step);
  });

  $('.rating-select').mouseleave(function(e) {
   var newWidth = $(this).find('select').val();
   $('.rating-select span span').width(newWidth*step);
  });

  $('.rating-select').click(function(e) {
   e.preventDefault();
   $(this).find('select').val($(this).data('rating'));
   document.getElementById("hiddenForm").value = /* VALUE */;
  });
 }
};

.rating {
 color: #ca293e;
 margin-bottom: 10px;
 letter-spacing: 5px;
}
.rating.rating-select {
 cursor: pointer;
}
.rating > span {
 position: relative;
 overflow: hidden;
}
.rating > span:before {
 content: "\f006\f006\f006\f006\f006";
 font-family: 'fontAwesome' !important;
 margin-right: -5px;
}
.rating > span span {
 position: absolute;
 left: 0;
 top: 0;
 height: 100%;
 line-height: 25px;
}
.rating > span span:after {
 content: "\f005\f005\f005\f005\f005";
 position: absolute;
 top: -3px;
 left: 0;
 font-family: 'fontAwesome' !important;
 width: 100%;
 margin-right: -5px;
 overflow: hidden;
 white-space: nowrap;
}

<div class="rating rating-select">
 <span><span></span></span>
 <select>
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
 </select>
</div>

感谢帮助:)

Answer 1

试用 jQuery Raty 插件，它是为此而设计的，而且非常易于使用。

有了这个你可以这样得到你的分数：

<div id="raty1"></div>

<script>
$('#raty1').raty({
   click: function(score, evt) {
     alert('ID: '+this.id+' Score: '+score);
   }
});
</script>

Javascript - 如何在 Click 函数上取回值

Javascript - How to get the value back on a Click function

jquery

getelementbyid