覆盖div上的rails link_to

Question

我有一个像这样的div结构：

          <% @posts.each do |post| %>
            <!-- Shot -->
            <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
              <div class="shot shot-minimal">
                <div class="shot-preview">
                  <a class="img" href="shot-gallery.html"><img src="http://rwdtow.stdout.in/img/avatar-icon.png" alt=""></a>

                  <a class="text-overlay">
                      <span class="heading"><%= post.tite %></span>
                      <span class="desc"><%= post.shortdescription %></span>
                    <time datetime="2016-02-04 22:30">7 hours ago</time>
                  </a>
                </div>

                <div class="shot-detail">
                  <div class="shot-info">
                    <p><%= post.title %></p>
                  </div>

                  <ul class="shot-stats">
                    <li><i class="fa fa-eye"></i><span>6.3k</span></li>
                    <li><a class="like" href="#"><i class="fa fa-heart"></i><span>1.2k</span></a></li>
                  </ul>
                </div>
              </div>
            </div>
            <!-- END Shot -->
          <% end %>

在上面的div中，我有一个叠加层：

              <a class="text-overlay">
                  <span class="heading"><%= post.tite %></span>
                  <span class="desc"><%= post.shortdescription %></span>
                <time datetime="2016-02-04 22:30">7 hours ago</time>
              </a>

所以我用覆盖层放置了一个link_to，因此文本覆盖了，文本是可点击的：

              <%= link_to post, class:"text-overlay" do %>        
                  <span class="heading"><%= post.tite %></span>
                  <span class="desc"><%= post.shortdescription %></span>
                <time datetime="2016-02-04 22:30">7 hours ago</time>
              <% end %>

该叠加层工作正常，但是当我单击它时，它并没有带我去看帖子的显示操作。 这是我最终代码的外观：

      <% @posts.each do |post| %>
        <!-- Shot -->
        <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
          <div class="shot shot-minimal">
            <div class="shot-preview">
              <a class="img" href="shot-gallery.html"><img src="http://rwdtow.stdout.in/img/avatar-icon.png" alt=""></a>

              <%= link_to post, class:"text-overlay" do %>        
               <span class="heading"><%= post.tite %></span>
               <span class="desc"><%= post.shortdescription %></span>
               <time datetime="2016-02-04 22:30">7 hours ago</time>
              <% end %>
            </div>

            <div class="shot-detail">
              <div class="shot-info">
                <p><%= post.title %></p>
              </div>

              <ul class="shot-stats">
                <li><i class="fa fa-eye"></i><span>6.3k</span></li>
                <li><a class="like" href="#"><i class="fa fa-heart"></i><span>1.2k</span></a></li>
              </ul>
            </div>
          </div>
        </div>
        <!-- END Shot -->
      <% end %>

Answer 1

抱歉，由于我的声誉，我无法发表评论。 您能再给我两件事吗？

1. 在浏览器中呈现的HTML代码。 您可以通过在浏览器中执行“检查元素”来获取它。
2. 与$(".text-overlay")关联的JavaScript / JQuery / CoffeeScript。 删除event.preventDefault() 。 我使用了JQuery语法。 如果您正在使用其他库，请查找相同的语法并删除。