Rails усекается с переключателем "читать дальше"

Question

У меня есть абзац, который я хочу обрезать с возможностью щелкнуть "читать дальше" и открыть его вместе с остальным содержимым. Контент поступает из поля базы данных. Вот что я имею для усечения:

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

Я не могу найти способ сделать это с данными, извлеченными из базы данных. Я вижу много примеров использования полного текста с текстом, который вы хотите скрыть в отдельном теге div. Но, поскольку этот контент поступает из базы данных и является динамическим, я не могу найти никакой информации о том, как это сделать.

Answer 1

Вы можете попробовать следующее

<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>

Answer 2

Я знаю, что присоединяюсь к этому разговору немного поздно. Я занимался той же проблемой, пытаясь найти решение, описанное выше, которое работает просто отлично. Тем не менее, SEO-контент, который был скрыт, не был проиндексирован поисковыми системами. Я тоже проверил в Lynx, и по ссылке нельзя перейти (очевидно). Так что решил это решение Джед Фостер | readmore.js - lynx может правильно его прочитать, и теперь я жду обновления индекса SE и посмотрим, смогу ли я найти себя в результатах поиска. На всякий случай, если кто-то находится в подобной ситуации...