12

我有一个段落，我想通过单击“阅读更多”的选项来截断它，并让它与其余内容一起滑动打开。内容来自数据库字段。这是我截断的内容：

<%= truncate(@major.glance, :length => 250, :omission => '... Read More')%>

我似乎无法找到一种方法来处理从数据库中提取的数据。我看到很多使用全文的例子，你想隐藏在一个单独的 div 标签中的文本。但是，由于此内容来自数据库并且是动态的，因此我找不到有关如何执行此操作的任何信息。

4

2 回答 2

26

您可以尝试以下方法

<div>
  <% if @major.glance.length > 250 %>
    <%= link_to_function truncate(@major.glance, length: 250), "$(this).parent().html('#{escape_javascript @major.glance}')" %>
  <% else %>
    <%= @major.glance %>
  <% end %>
</div>

或者如果您更喜欢使用Read more链接

<div>
  <% if @major.glance.length > 250 %>
    <%= truncate(@major.glance, length: 250) %>
    <%= link_to_function '...Read more', "$(this).parent().html('#{escape_javascript @major.glance}')" %>
  <% else %>
    <%= @major.glance %>
  <% end %>
<div>

更新

由于在 Rails 4 中link_to_function已弃用，建议使用非干扰的 js，请使用以下内容

<div>
  <% if @major.glance.length > 250 %>
    <%= truncate(@major.glance, length: 250) %>
    <%= link_to '...Read more', '', class: "read-more-#{@major.id}" %>
    <script>
      $('.read-more-<%= @major.id %>').on('click', function(e) {
        e.preventDefault()
        $(this).parent().html('<%= escape_javascript @major.glance %>')
      })
    </script>
  <% else %>
    <%= @major.glance %>
  <% end %>
<div>
于 2013-03-07T03:31:06.927 回答
5

我知道我加入这个对话有点晚了。我一直在解决同样的问题，尝试了上面的解决方案，效果很好。但是，已隐藏的 SEO 明智内容并未被搜索引擎索引。我也签入了Lynx，但链接无法访问（显然）。因此， Jed Foster选择了这个解决方案| readmore.js - lynx 可以正确读取它，现在我正在等待 SE 索引更新，看看我是否可以在搜索结果中找到自己。以防万一有人遇到类似情况...

于 2014-10-06T01:01:07.110 回答