如何在灯箱图片上设置外部 link？

Question

我有一个图库和一个管理图库页面。

在管理图库中，我有一个删除按钮出现在图像上，但是当我点击它时，它打开了一个灯箱加载，而不是消息 "Are you sure?"。

我假设是灯箱代码让 link 做到了这一点。我该如何解决这个问题？

<div class="lightbox-grid square-thumbs" data-gallery-title="Gallery">
    <ul>
       <% @galleries.each do |gallery| %>
       <% gallery.pictures.each do |f| %>
         <div class="contentdeletar">
            <li>
              <div class="deletar">
                <%= link_to 'delete', f, method: :delete, data: { confirm: 'Are you sure?' } %>
               </div>
               <a href="<%= f.image.url(:large) %>" data-lightbox="true" data-title="<%= f.description %>">
               <div class="background-image-holder">
                  <img alt="image" class="background-image" src="<%= f.image.url(:large) %>">
               </div>
               </a>
            </li>
          </div>
      <% end %>
      <% end %>
    </ul>
</div>

行 <%= link_to 'delete', f, method: :delete, data: { confirm: 'Are you sure?' } %> 由于某种原因无法正常工作。我认为它试图打开灯箱内的 link 或类似的东西

Answer 1

我发现scripts.js有这个

$('.lightbox-grid li a').each(function(){
        var galleryTitle = $(this).closest('.lightbox-grid').attr('data-gallery-title');
        $(this).attr('data-lightbox', galleryTitle);
    });

所以 a 的一切都会像那样。

所以我创建了一个名为 dav 的 div 并将灯箱 link 放在里面

<div class="deletar">
   <%= link_to 'delete', f, method: :delete, data: { confirm: 'Are you sure?' } %>
</div>
<div class="dav">
   <a href="<%= f.image.url(:large) %>" data-lightbox="true" data-title="<%= f.description %>">
   <div class="background-image-holder">
      <img alt="image" class="background-image" src="<%= f.image.url(:large) %>">
   </div>
</div>

并将 js 文件更新为 $('.lightbox-grid li dav a').each(function(){ 所以现在它只能在 li dav a links

内工作

如何在灯箱图片上设置外部 link？

how to set an external link over a lightbox image?

javascript

jquery

html

ruby-on-rails

lightbox