Rails——在每个数据库条目中运行一个javascript

Rails - Running a javascript within each database entry

本文关键字：一个 javascript 运行 数据库 Rails      更新时间：2024-03-11

写起来有点困惑，但这是我第一次做这样的事情。因此，我有一个html页面，在那里我循环浏览数据库以显示数据，但也有一个javascript脚本，它检查一些值并相应地更改背景，但问题是它只发生在第一个元素上。

这里是我代码的一部分：

<% #prints the artists that match the search, prints all for empty search %>
      <% @top100.each_slice(1) do |top100| %>
            <div class="row">
              <% top100.each do |top100| %>
                    <div id = "arrow">
                      <p>test</p>
                    </div>
                    <script>
                        var current = <%= top100.top100Current %>
                        var lastWeek = <%= top100.top100LastWeek %>
                        if(current < lastWeek) {
                          document.getElementById("arrow").style.backgroundImage = "url('http://www.clker.com/cliparts/i/5/z/3/G/y/red-arrow-down-th.png')";
                        }
                        else {
                          document.getElementById("arrow").style.backgroundImage = "url('http://www.clker.com/cliparts/d/3/c/4/12065699181684813498pitr_green_single_arrows_set_3.svg.thumb.png')";
                        }
                    </script>
              <% end %>
            </div>
      <% end %>

document.getElementById（"arrow"）只返回一个元素。您的页面有多个id为"arrow"的元素。Javascript将在客户端运行，所以多次渲染脚本标记并不重要。

若要解决此问题，请使用类"arrow"并使用Document.getElementsByClassName（）.SEE了解用法信息。

渲染结束时只有一个脚本标记就足够了。

这里有几件事可能会让你绊倒。

首先：您正在选择一个ID。ID是唯一的。您的脚本会找到带有箭头的第一个id，并应用该脚本。创建一个唯一的ID（如果是循环，则基于索引）或使用一个类

第二：在您的脚本中，没有任何内容真正循环通过dom元素。如果您不反对jquery，我会以100的父对象为目标，并循环遍历子对象，每次执行一个脚本。

第三：看起来你实际上是在循环中创建一个脚本。你不需要为每个孩子创建一个脚本，创建一个在最后循环通过dom的脚本会更好，也更节省内存。

我会渲染所有内容，然后使用这样的脚本：

$('#parent').children('div').each(function () {
     // "this" is the current element in the loop
     // Assign style here
});

作为替代方案，您可以在rails循环中添加一个类名，然后使用css吗？

相关文章：