如何根据我单击的块中的项目呈现不同版本的部分？

Question

我有一个模型 Painting 有很多记录。我将它们全部打印出来，并且我想为每一个附加一些 jQuery 以便单击每幅画会呈现带有大版本画作的部分。

<div id="viewer"></div>
<% Painting.all.each_with_index do |painting, index| %>
    <%= image_tag(painting.path, id:"painting"+index%>
    <% @painting = painting %>
    <script type="text/javascript">
        $("#painting<%=index%>").click(function() {
          $("#viewer").html("<%= escape_javascript(render 'partial') %>");
        });
    </script>
<%end%>

_partial.html.erb

<%= image_tag(@painting.path, class:"large-painting") %>
<!-- more code -->

问题是，值 @painting 每次循环都会重置，到最后它等于最后一幅画。所以不管我点哪张画，最后一张永远是局部渲染的那张。

谁能想办法让局部渲染的画与我点击的那幅相对应，而不用每一个单独写jQuery？

Answer 1

您能否将每个图像的大版本的 URL 添加为图像上的自定义属性，然后将您的查看器引用的 URL 更新为对应的 URL用户点击了什么图片？

类似于：

$("#painting<%=index%>").click( function(){
    $(Viewer_Image_Element).prop('src', $(this).prop('custom_URL_property')) 
  });

或者，您可以创建一个新的控制器动作（或对现有控制器动作的新响应），通过渲染部分图像来响应。您可以使用 $.ajax 在有人点击图像时调用控制器操作，并将图像 ID 作为参数与请求一起发送。服务器将使用参数正确渲染部分内容，然后在响应中将其发回。然后只需将 html 插入查看器即可。如果这是您要走的路线，我可以添加一些示例代码。

这也意味着用户在首次加载页面时不需要下载每个图像的大版本。这可能是好事，也可能不是好事。

如何根据我单击的块中的项目呈现不同版本的部分？

How can I render different versions of a partial based on which item in a block I click on?

javascript

variables

jquery

ruby-on-rails

instance-variables