Проблема с алгоритмом сокращения предложений - PullRequest
Новая
       13

Проблема с алгоритмом сокращения предложений

4 голосов
/ 06 июля 2011

У меня есть веб-страница, которая отображает несколько текстовых записей, которые не имеют ограничений по их длине. Они автоматически обрезаются, если они слишком длинные, чтобы избежать перехода на новую линию. Это функция PHP, чтобы вырезать их: 

function cutSentence($sentence, $maxlen = 16) {
    $result = trim(substr($sentence, 0, $maxlen));

    $resultarr = array(
            'result' => $result,
            'islong' => (strlen($sentence) > $maxlen) ? true : false    
        );

    return $resultarr;
}

Как вы можете видеть на картинке ниже, результат в порядке, но есть несколько исключений. Строка, содержащая несколько символов M (я должен их учесть), перейдет на новую строку.

В настоящее время все строки обрезаются после 16 символов, что уже очень мало и затрудняет их чтение.

Я хотел бы знать, существует ли способ убедиться, что предложения, которые заслуживают большего количества пробелов, получают его, а те, которые содержат широкие символы, в конечном итоге обрезаются с меньшим количеством символов (просьба не предлагать использовать свойство CSS text- Переполнение: ellipsis, потому что он не поддерживается широко, и он не позволит мне сделать «...» доступной по клику для ссылки на полную запись, и мне это нужно любой ценой).

Заранее спасибо.

Ответы [ 4 ]

3 голосов
/ 06 июля 2011

Вы можете использовать шрифт фиксированной ширины, чтобы все символы были одинаковыми по ширине.Или, при желании, получите, сколько пикселей в ширину составляет каждый символ, сложите их вместе и удалите дополнительный символ, если длина пикселя превышает определенную величину.

1 голос
/ 06 июля 2011

Делайте это в Javascript, а не в PHP. Используйте свойство DOM offsetWidth, чтобы получить ширину содержащего элемента. Если она превышает некоторую максимальную ширину, то усечь соответственно.

Код скопирован с Как мне имитировать переполнение текста: многоточие в Firefox? : 

function addOverflowEllipsis( containerElement, maxWidth )
{
    var contents = containerElement.innerHTML;
    var pixelWidth = containerElement.offsetWidth;
    if(pixelWidth > maxWidth)
    {
        contents = contents + "…"; // ellipsis character, not "..." but "…"
    }
    while(pixelWidth > maxWidth)
    {
        contents = contents.substring(0,(contents.length - 2)) + "…";
        containerElement.innerHTML = contents;
        pixelWidth = containerElement.offsetWidth;
    }
}
1 голос
/ 06 июля 2011

Если стиль вашего приложения не слишком важен, вы можете просто использовать шрифт в семействе моноширин, таких как Courier.

0 голосов
/ 06 июля 2011

Поскольку вы запрашиваете веб-страницу, вы можете использовать CSS-переполнение текста, чтобы сделать это. Кажется, что он достаточно поддерживается, и для Firefox, кажется, есть css обходные пути или jquery обходные пути ...

Примерно так: 

span.ellipsis {
   white-space:nowrap;
   text-overflow:ellipsis;
   overflow:hidden;
   width:100%;
   display:block;
}

Если вы заполните больше текста, чем уместится, в конце добавятся три точки. Просто обрежьте текст, если он действительно слишком длинный, чтобы не тратить пространство HTML.

Подробнее здесь:

https://developer.mozilla.org/En/CSS/Text-overflow

Добавление ссылки «увидеть больше» в конце достаточно просто, так как добавление другого промежутка с фиксированной шириной, содержащего ссылку, чтобы увидеть больше. текст будет усечен с помощью многоточия до этого.

...