WordPress-循环中的脚本只工作一次


WordPress - Script inside the loop only works once

我的头中有这个脚本,索引中有这段代码,在post循环中

  $(function() {
    var score = parseInt($('.post-score').text().trim());
    var color = '#de1d1d';
    if (!isNaN(score)) {
      if (score >= 5) {
        color = '#b84e1f';
      }
      if (score >= 7) {
        color = '#26b81f';
      }
      if (score >= 9) {
        color = '#d9e019';
      }
      if (score >= 10) {
        color = '#0cf';
      }
      $('.post-score').css('color', color);
    }
  });
<?php if( in_category( 'reviews') ) : ?>
<div id="post">
  <span class="post-score">
      <?php the_field('customfield'); ?>
  </span>
</div>
<?php endif; ?>

此函数根据输出的数字更改自定义字段文本的颜色,它实际上运行良好,但只有一次。它只适用于第一篇有评论的帖子,而不是每一篇帖子。

我的代码出了什么问题?

分别尝试jQuery:https://api.jquery.com/each/

现在,您的代码只查看它找到的第一个.post-score

编辑:我在这把小提琴上为你工作了https://jsfiddle.net/8b53j2ah/1/

JQuery代码可能只执行一次。但是使用PHP也可以实现同样的效果。
<?php if( in_category( 'reviews') ) :
    $score = get_field('customfield');
    $score_color = '';
    if($score >= 5 && $score < 7) $score_color = 'b84e1f';
      elseif($score >= 7 && $score < 9) $score_color = '26b81f';
      elseif($score >= 9  && $score < 10) $score_color = 'd9e019';
      elseif($score >= 10) $score_color = '0cf';
?>
<div id="post">
  <span class="post-score" style="color: #<?php echo $score_color; ?>">
      <?php the_field('customfield'); ?>
  </span>
</div>
<?php endif; ?>

您可能希望使用单独的CSS类,而不是样式属性。

您可以设置一个包含上述javascript的函数,然后在onchange属性下运行它。例如onchange="function()"