Отображать только 10 символов длинной строки?

Ответ 1

Если я правильно понял, вы хотите ограничить строку до 10 символов?

var str = 'Some very long string';
if(str.length > 10) str = str.substring(0,10);

Что-то вроде этого?

Ответ 2

И вот пример jQuery:

Текстовое поле HTML:

<input type="text" id="myTextfield" />

Код jQuery для ограничения его размера:

var elem = $("#myTextfield");
if(elem) elem.val(elem.val().substr(0,10));

В качестве примера вы можете использовать приведенный выше код jQuery, чтобы запретить пользователю вводить более 10 символов во время ввода; следующий фрагмент кода выполняет именно это:

$(document).ready(function() {
    var elem = $("#myTextfield");
    if (elem) {
        elem.keydown(function() {
            if (elem.val().length > 10)
                elem.val(elem.val().substr(0, 10));
        });
    }            
});

Обновление: Вышеприведенный фрагмент кода использовался только для показа примера использования.

Следующий фрагмент кода справится с проблемой с элементом DIV:

$(document).ready(function() {
    var elem = $(".tasks-overflow");
    if(elem){
        if (elem.text().length > 10)
                elem.text(elem.text().substr(0,10))
    }
});

Обратите внимание на, что я использую text вместо val в этом случае, так как метод val, похоже, не работает с элементом DIV.

Ответ 3

Создание собственного ответа, поскольку никто не считал, что раскол может не произойти (более короткий текст). В этом случае мы не хотим добавлять "..." в качестве суффикса.

Тернарный оператор сортирует это:

var text = "blahalhahkanhklanlkanhlanlanhak";
var count = 35;

var result = text.slice(0, count) + (text.length > count ? "..." : "");

Может быть закрыт для функции:

function fn(text, count){
    return text.slice(0, count) + (text.length > count ? "..." : "");
}

console.log(fn("aognaglkanglnagln", 10));

И расширьте класс помощников, чтобы вы могли выбрать, хотите ли вы точки или нет:

function fn(text, count, insertDots){
    return text.slice(0, count) + (((text.length > count) && insertDots) ? "..." : "");
}

console.log(fn("aognaglkanglnagln", 10, true));
console.log(fn("aognaglkanglnagln", 10, false));

Ответ 4

HTML

<p id='longText'>Some very very very very very very very very very very very long string</p>

javascript (на готовом doc)

var longText = $('#longText');
longText.text(longText.text().substr(0, 10));

Если у вас есть несколько слов в тексте и вы хотите, чтобы у каждого было не более 10 символов, вы можете сделать:

var longText = $('#longText');
var text = longText.text();
var regex = /\w{11}\w*/, match;
while(match = regex.exec(text)) {
    text = text.replace(match[0], match[0].substr(0, 10));
}
longText.text(text);

Ответ 5

Что вы должны делать, когда вы усекаете строку до десяти символов, добавьте фактический объект эллипса html: …, а не три периода.

Ответ 6

('very long string'.slice(0,10))+'...'
// "very long ..."

Ответ 7

Это больше похоже на то, что вы, вероятно, захотите.

$(document).ready(function(){
var stringWithShorterURLs = getReplacementString($(".tasks-overflow").text());

function getReplacementString(str){
    return str.replace(/(https?\:\/\/[^\s]*)/gi,function(match){
        return match.substring(0,10) + "..."
    });
}});

вы даете ему свой элемент html в первой строке, а затем он берет весь текст, заменяет URL-адреса 10-символьными длинными версиями и возвращает их вам. Кажется немного странным иметь только 3 символа URL, поэтому я рекомендовал бы это, если возможно.

$(document).ready(function(){
var stringWithShorterURLs = getReplacementString($(".tasks-overflow p").text());

function getReplacementString(str){
    return str.replace(/https?\:\/\/([^\s]*)/gi,function(match){
        return match.substring(0,10) + "..."
    });
}});

который вырвет http://или https://и напечатает до 10 символов в www.example.com

Ответ 8

@jolly.exe

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

HTML

<div id="stuff">a reallly really really long titleasdfasdfasdfasdfasdfasdfasdfadsf</div> 

JS

 function cutString(id){    
     var text = document.getElementById(id).innerHTML;         
     var charsToCutTo = 30;
        if(text.length>charsToCutTo){
            var strShort = "";
            for(i = 0; i < charsToCutTo; i++){
                strShort += text[i];
            }
            document.getElementById(id).title = "text";
            document.getElementById(id).innerHTML = strShort + "...";
        }            
     };

cutString('stuff'); 

Ответ 9

Показать текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст длинный текст

до

длинный текст длинный текст длинный ...

        function cutString(text){    
            var wordsToCut = 5;
            var wordsArray = text.split(" ");
            if(wordsArray.length>wordsToCut){
                var strShort = "";
                for(i = 0; i < wordsToCut; i++){
                    strShort += wordsArray[i] + " ";
                }   
                return strShort+"...";
            }else{
                return text;
            }
         };

Ответ 10

Попробуй это :)

var mystring = "How do I get a long text string";
mystring = mystring.substring(0,10);
alert(mystring);

Ответ 11

var example = "I am too long string";
var result;

// Slice is JS function
result = example.slice(0, 10)+'...'; //if you need dots after the string you can add

В переменной результата содержится "Я тоже..."

Ответ 12

Хотя это не будет ограничивать строку до ровно 10 символов, почему бы не позволить браузеру работать для вас с помощью CSS:

.no-overflow {
    white-space: no-wrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

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