Question

我对Javascript / jQuery很新。试着理解以下代码出了什么问题？：

使用Javascript：

$('.rating-stars').each(function() {
    var currentScore = $(this).nextAll('.current-score');
    console.log(currentScore);
    $('.rating-stars').barrating('show', {
        theme: 'fontawesome-stars-o',
        deselectable: false,
        showSelectedRating: false,
        initialRating: currentScore,
    });
});

HTML：

<form id="vote_form" class="form-inline" method="post" action="/y/update_rating/39">

  <span class="h3"><a href="#">Title</a></span>             

    <select class="rating-stars" id="id_vote" name="vote">
      <option value=""></option>
      <option value="1"></option>
      <option value="2"></option>
      <option value="3"></option>
      <option value="4"></option>
      <option value="5"></option>
    </select>

  <span class="current-score">4.0</span>

</form>

简而言之，我有一个带有类的元素.rating-stars一个元素，其旁边有.current-score ，它显示一个得分/整数。

我想将initialRating设置为.current-score元素显示的数字。

（正如您可以通过代码猜测的那样，页面上显示的评分超过1，因此.each函数）

目前，console.log正在返回：

[select＃id_vote.rating-stars，context：select＃id_vote.rating-stars] 0：select＃id_vote.rating-starscontext：select＃id_vote.rating-starslength：1__proto__：Object [0] ratings.js：7 [select＃id_vote.rating-stars，context：select＃id_vote.rating-stars]

Answer 1

在我的回答评论的帮助下，我提出了一个解决方案：

我误解了.next（） - 我没有意识到它只是寻找兄弟姐妹，我认为它实际上是从上到下阅读所有内容，而不是以分层方式阅读。

我只需要在.next或.nextAll调用之前将.parent（）添加到我的变量中：

var currentScore = $(this).parent().next('.current-score').html();

Answer 2

试试这个 -

HTML

<form id="vote_form" class="form-inline" method="post" action="/y/update_rating/39">

  <span class="h3"><a href="#">Title</a></span>             

    <select class="rating-stars" id="id_vote" name="vote">
      <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>

  <span class="current-score">3.0</span>

</form>

Jquery

$('.rating-stars').each(function() {
    var currentScore = $(this).next('.current-score').text();
    console.log(currentScore);
    $(this).barrating('show', {
        theme: 'fontawesome-stars-o',
        deselectable: false,
        showSelectedRating: false,
        initialRating: currentScore,        
    });
});

链接到JSFiddle

Answer 3

我认为在你的情况下.next()会起作用：

注意：您正在尝试获取元素，但您需要获取元素html 或文字。

$('.rating-stars').each(function() {
    var currentScore = $(this).next('.current-score').html();
    console.log(currentScore);
    $('.rating-stars').barrating('show', {
        theme: 'fontawesome-stars-o',
        deselectable: false,
        showSelectedRating: false,
        initialRating: currentScore,
    });
});

为什么.nextAll（）没有返回预期的元素？

3 个答案: