请引用下图以了解外观。
我有一个名为 sauces 的 ruby on rails 数据库。
sauces表中的字段如下:
- 编号
- 姓名
- 描述
- 图片
这是我的CSS:
#container{width:950px;height:800px;}
#title{this_is:irrelevant;}
#sauce_picture{bla bla}
#sauce_name{bla bla}
#sauce_splatter{background-image:url("someimage.png")}
HTML
<html>
<body>
<div id="container>
<div id="title><h1>SAUCES</h1></div>
<div id="sauce_picture><img src="somepic.png/></div>
<div id="sauce_name><h2>Sauce 1</h2></div>
<div id="sauce_splatter>
<p>Sauce Description Goes Here</p>
</div>
</div>
</body>
</html>
好的，rails 数据库表有 6 条记录，每个字段都存在。我想要实现的是说页面已加载。我希望记录位于第一条记录，其中 <img src="somepic.png/> 的内容, <h2>Sauce 1</h2> , <p>Sauce Description Goes Here</p>都是从数据库表中检索的，因为计数从 1 开始。
我不知道如何做到这一点，以便在按下右箭头时，id 变为 2，并且上面的内容更改为记录号 2 (id=2) 中的内容。
最后，如果 id=1(即第一条记录，左箭头作为链接被禁用，而当最后一条记录存在时，右箭头变为禁用。 这将通过使用 JQuery 更改元素来实现，但我如何同时使用 Rails 和 Jquery。
这样，如果我将来在数据库表中添加新的调味料，我就不必更改任何代码，毕竟这就是 MCV 的全部意义。
谢谢
最佳答案
一个可能的解决方案，只要您的 Sauces-Table 没有很多条目，就是交出一个像这样的数组
@sauces = Sauce.all
您的 View 可以默认呈现数组的一个条目，为了更新 div，您需要编写一些 JavaScript 来跟踪实际选择的条目，并使用新选择的酱料的属性更新 div。
对于更大的表格，您可以使用 AJAX 从后端检索选定的酱料，但您仍然需要通过 JavaScript 在异步调用结果上更新内容 div。
您还可以为每个酱汁条目呈现一个 div，并隐藏除要显示的实际一个之外的所有内容，按下按钮后，将显示带有所选酱汁的隐藏 div，另一个也将通过 JavaScript 设置为不可见
关于jquery - 根据 Ruby on Rails 中的当前数据库记录更改元素内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13128094/