javascript - 卡住 : onclick background color attribute changing correctly but actual color not displaying (with PHP loop)

Question

我有一个收藏夹按钮，可以选择当前显示的颜色，然后将此颜色注入(inject)收藏夹栏。我添加了一个 PHP 循环来选择不同的颜色并将它们添加到最后选择的收藏项旁边。背景属性正在更改，但由于某种原因，它没有显示颜色。

JavaScript:

    $('#fav-colour-pallete-' + id).click(function getFav() { //Button
      var favColor = $('#colour-pallete-' + id).attr('color-hex');
            $('.fav-color-' + id).css('background', '#' + favColor);
                  $('.fav-color-' + id).attr('color-hex', favColor)
      });

 }

HTML:

<div class="col-sm-4 favorites">
        <p class="h6 favorites-title mb-0 mt-2">Favorites:</p>
           <ul class="list-inline favorites-list mb-0">
              <?php for($i=1; $i<=6; $i++) { ?>
                 <li class="list-inline-item fav-color-<?php echo $i; ? 
                     >"></li>
<button id="fav-colour-pallete-<?php echo $i; ?>" class="fav- 
        colour-pallete b  tn btn-secondary palette-btn" type="button">
          <i class="far fa-heart"></i>
        </button>
              <?php } ?>
          </ul>
 </div>

如果我从 HTML 中删除循环并从 JavaScript 中的 fav-color 中删除 ID，它会显示/将颜色添加到收藏夹栏，但会替换最后一个收藏夹。

我认为这个问题与循环有关。奇怪的是，我可以在控制台中看到背景属性正确更改，但颜色实际上并没有改变。

Answer 1

您在脚本中定位的#id 在哪里？它不是来自 PHP 循环。这是您的脚本的定位错误。尝试手动粘贴

，您将遇到同样的问题。 (不要忘记更改 fav-color 的索引:)