Как по клику показать обрезанный текст?

Question

[Qurel]

Этот код обрезает большое количество символов (он работает):

// Спрятать большой текст
    $(".b-notepad__feedback-letter_block_text").text(function(i, text) {

        if (text.length >= 471) {
            text = text.substring(0, 471);
            var lastIndex = text.lastIndexOf(" ");       // позиция последнего пробела
            text = text.substring(0, lastIndex) + '...'; // обрезаем до последнего слова
            $(this).next().show();
        }

        $(this).text(text);

    });

Этот код должен показывать полностью весь текст, но он не работает:

$('.js-feedback_showall').click(function () {

        $(this).prev().text(function(i, text) {
           text = text.substring(0);
           $(this).prev().text(text);
        });

    });

Comments

[Eugene Chefranov]

Добавьте еще разметку HTML, может порядок дивов другой

[Qurel]

<div class="b-notepad__feedback-letter_block">
	<p class="b-notepad__feedback-letter_block_text">Длинный текст</p>
	<span class="b-notepad__feedback-letter_block_showall js-feedback_showall">Показать все</span>
</div>

[Qurel]

Пробую другой вариант:

Этот код обрезает текст

//Показать весь сопроводительный текст

    $('.js-feedback_showall').each(function() {
        if ($(this).prev().text().length > 471) {
            $(this).addClass("block");
            $(this).prev().css({'max-height':'60px'});
        }
    });

Этот код только показывает текст, но не скрывает (сначала скрывает, а потом обратно показывает):

$('.js-feedback_showall').click(function () {

        if($(this).prev().css({'max-height':'60px'})) {
            $(this).prev().animate({"max-height":1000},500)
        } else {
            // $(this).prev().animate({"max-height":60},500)
            $(this).prev().css({'max-height':'60px'});
        }

    });

[Qurel]

Поменяла условие и все заработало - текст нормально показывается и скрывается

$('.js-feedback_showall').click(function () {

        if($(this).prev().height() === 60 ) {
            $(this).prev().animate({"max-height":1000},500)
        } else {
            $(this).prev().animate({"max-height":60},500);
        }

    });

[ThunderCat]

Qurel, где вы берете такие упоротые коды то???

[ThunderCat]

Qurel,

Поменяла условие и все заработало

Чисто из любопытства - сами хоть поняли в чем был косяк?

[Vann Damm]

ThunderCat, хаха, почему упоротые?

[Qurel]

ThunderCat, на Stackoverflow

[ThunderCat]

Vann Damm, Qurel,

if($(this).prev().css({'max-height':'60px'})) { // очевидно что здесь происходит создание 
//высоты в 60px и естественно что там в условии будет true ВСЕГДА
            $(this).prev().animate({"max-height":1000},500) // а эта строка всегда будет выполняться
// и менять высоту обратно в 1000
        } else ... //сюда никогда не проникает свет, ой, не доходит исполнение...

Answer 1

[ThunderCat]

1) Очевидно (не всем) что код с евентом должен быть внутри документ реди. Иначе работать скорее всего не будет.
2) Ну и очевидно что обрезав текст и вставив обратно откуда взяли, "провернуть фарш обратно" не получится... Для этого надо где-то хранить исходный текст собственно... По этому вторая функция, даже в случае срабатывания, просто выдаст вам тот же обрезанный текст.