如何在 css 类名中使用 javascript 变量并在 Rails 中通过 jquery 获取 css 颜色名

Question

第一季度。

我一共有7个div（类名：scale-up-center0 ~ 7）， 我想使用 javascript 变量来表示数字 1 到 7。

我尝试了 for 语句，但它不起作用。

我希望 scale-up-center7 在单击 scale-up-center0-6 时改变颜色。

如何使用 javascript 变量作为 css 类名？

代码无效

$(document).ready(function() {
        for(var i=0; i<7; i++) {
        $(".scale-up-center-<%=i%>").click(function() {
            var color = $(".scale-up-center-<%=i%>).css("background-color");
            $(".scale-up-center7").css("background-color", color);
            $("#post_color").val(color);
        }

    })
})

第二季度。

我通过jquery导入了css属性（background-color）并存储在color列中。

并通过表单的输入显示颜色。但它是以rgb(255,0,0)的形式表示的。

我在DB中有一个颜色列，但它是字符串类型，而rgb()没有。

我想导入颜色名称而不是 rgb。 （例如）返回“红色”，而不是 rgb (255,0,0)

_form.html.erb

  <div class="field">
    <%= form.label :color %>
    <%= form.text_area :color, id: 'post_color' %>
  </div>

Answer 1

第一季度。 尝试使用$(".scale-up-center-" + i) 而不是$(".scale-up-center-<%=i%>")

第二季度。 将颜色保存为 CSS 颜色名称可能有点棘手。 我建议您将 RGB 转换为 HEX（此 question 可能会有所帮助）并将其转换为带有 CSS 颜色列表的颜色名称（例如从此处 css-color-names）。