Javascript 在laravel 5中显示多评级星jquery条评级

我想显示多星级。我在jQuery循环中获取正确的评级值时遇到问题

我的html如下所示：

<select id="example{{$review->id}}" class="example" review-id="{{$review->id}}" data-rating="{{$review->rating}}">
           <option value=""></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>

示例数据：

第一个结果是五星评级和审查_id=1

第二个结果是四星评级和审查_id=2

在jQuery中，它正确地循环了2次，但x和review_id的结果都是5星级，id为1

---

如何解决这一问题，使jquery bar rating star可以在两个结果上正确显示？

请尝试将脚本更新到以下内容

$(function() {
    $('.example').each(function() {
        var x = $(this).attr('data-rating');
        console.log(x);
        var review_id = $(this).attr('review-id');
        console.log(review_id);
        $('#example' +review_id).barrating({
            theme: 'fontawesome-stars',
            showSelectedRating: true,
            initialRating: x,
            readonly: true
        });
    });
});

---

在jQuery.each（）循环中，您应该引用$（this）来检索循环中活动元素的数据。

尝试将脚本更新到以下位置

$(function() {
    $('.example').each(function() {
        var x = $(this).attr('data-rating');
        console.log(x);
        var review_id = $(this).attr('review-id');
        console.log(review_id);
        $('#example' +review_id).barrating({
            theme: 'fontawesome-stars',
            showSelectedRating: true,
            initialRating: x,
            readonly: true
        });
    });
});

---

在jQuery.each（）循环中，您应该引用$（this）来检索循环中活动元素的数据。

Easy fix的目标是类而不是ID

例如：

脚本：

<script type="text/javascript">
   $(function() {
      $('.example').barrating({
        theme: 'fontawesome-stars',
        initialRating: $('.example').data('current-rating'),
      });
   });
</script>

$（函数（）{
$（'.example'）。拦河坝({
主题:"超级明星",，
初始评级：$（'.example'）。数据（'当前评级'），
});
});

HTML:

1.
2.
3.
4.
5.
1.
2.
3.
4.
5.

Easy fix的目标是类而不是ID

例如：

脚本：

<script type="text/javascript">
   $(function() {
      $('.example').barrating({
        theme: 'fontawesome-stars',
        initialRating: $('.example').data('current-rating'),
      });
   });
</script>

$（函数（）{
$（'.example'）。拦河坝({
主题:"超级明星",，
初始评级：$（'.example'）。数据（'当前评级'），
});
});

HTML:

1.
2.
3.
4.
5.
1.
2.
3.
4.
5.