substr_len с HTML, показывать первые символы X и ссылку «Подробнее» (плагин jquery.readmore) - PullRequest
Новая
       34

substr_len с HTML, показывать первые символы X и ссылку «Подробнее» (плагин jquery.readmore)

0 голосов
/ 17 мая 2011

Я использую плагин для отображения только первых 500 символов текста ... Но он не работает с некоторым HTML, я не могу воспроизвести его, но я думаю, что это может быть с тегом <img>или <blockquote> или, может быть, <ul> / <ol>

Он просто показывает весь текст И ссылку "Подробнее" ...

Есть идеи?

Это код 

(function ($) {
$.fn.readmore = function (settings) {

$('.home_excerpt').removeClass('home_excerpt');

var opts =  $.extend({}, $.fn.readmore.defaults, settings);

this.each(function () {
  $(this).data("opts", opts);
  if ($(this).html().length > opts.substr_len) {
    abridge($(this));
    linkage($(this));
  }
});

function linkage(elem) {
  elem.append(elem.data("opts").more_link);
  $(".text_seemore").click( function () {
    $(this).hide();
    $(this).siblings("span:not(.hidden)").hide().siblings("span.hidden").show();
    return false;
  });
}

function abridge(elem) {
  var opts = elem.data("opts");
  var txt = elem.html();
  var len = opts.substr_len;
  var dots = "<span>" + opts.ellipses + "</span>";
  var charAtLen = txt.substr(len, 1);
  while (len < txt.length && !/\s/.test(charAtLen)) {
      len++;
      charAtLen = txt.substr(len, 1);
  }
  var shown = txt.substring(0, len) + dots;
  var hidden = '<span class="hidden" style="display:none;">' + txt.substring(len, txt.length) + '</span>';
  elem.html(shown + hidden);
}

return this;
};

$.fn.readmore.defaults = {
substr_len: 500,
ellipses: '&#8230;',
more_link: '<br /><a href="#" class="text_seemore">See&nbsp;More</a>'
};

 })(jQuery);

1 Ответ

1 голос
/ 17 мая 2011

Кажется, что в вашей функции abridge() вы пытаетесь не разрезать слово пополам, если я правильно читаю ваш код.Проблема в том, что если после заданной длины нет пробелов, вы просто вернете все, но потом не проверяете, так ли это.Это означает, что вы вернете полный текст и добавите еще ссылку.

Когда вы обрабатываете HTML, приведенный выше случай является обычным случаем, если у вас есть строки из одного слова, таблицы с ячейками из одного слова,и т.д., если вы используете &nbsp; в качестве пробела.

Большая проблема заключается в том, что вы вырезаете HTML как строку, что почти наверняка приведет к нарушению разметки.Вы можете легко разрезать теги пополам, удалить закрывающие теги элементов блока и так далее.Посмотрите, можете ли вы использовать elem.text(), чтобы обработать его как чистую строку, или если вы хотите сохранить форматирование, посмотрите, сможете ли вы извлечь первый абзац или что-то подобное.

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

...