Question

php代码显示文本段落

<p class="feed-text" style="word-wrap:break-word;">
  <?php echo nl2br($feed->feed_text); ?>
</p>

用于在250个字符后对文本进行切片的Javascript代码，

$(function(){

    var minimized_elements = $('p.feed-text');
    minimized_elements.each(function(){    
        var t = $(this).text();        
        if(t.length < 250) return;

        $(this).html(
            t.slice(0,250)+'<span>... </span><a href="#" class="more">More</a>'+
            '<span style="display:none;">'+ t.slice(250,t.length)+' <a href="#" class="less">Less</a></span>'
            );

    }); 

    $('a.more', minimized_elements).click(function(event){
        event.preventDefault();
        $(this).hide().prev().hide();
        $(this).next().show();        
    });

    $('a.less', minimized_elements).click(function(event){
        event.preventDefault();
        $(this).parent().hide().prev().show().prev().show();    
    });

});

我现在面临的问题：

Ten little monkeys jumping on the bed . . . and tripping over teddy bears, 
slipping on banana peels, and falling off the dock!
Those naughty monkeys sure love to monkey around!
But just WHO is causing all this monkey business? 
Try fi... More

其实我输入的段落就像这样，

Ten little monkeys jumping on the bed . . . 
and tripping over teddy bears, slipping on banana peels,
and falling off the dock!Those naughty monkeys sure love to monkey around! 

But just WHO is causing all this monkey business? 
Try finding the naughtiest monkey in every 
scene--and watch as she gets her comeuppance at the end!

A classic monkey rhyme with delicious illustrations,
this is sure to be a favorite on every little monkey's bookshelf.

我需要像这样的输出，

Ten little monkeys jumping on the bed . . .
and tripping over teddy bears, slipping on banana peels,
and falling off the dock!Those naughty monkeys sure love to monkey around!

But just WHO is causing all this monkey business? Try f...More

脚本正在切片并正确显示文本。因为我使用此脚本将文本切片250个字符并放置more和less选项，如果在段落中输入任何句子，现在它没有显示为段落。它不是显示为段落，而是连续显示任何缩进。如果用户使用我的脚本使用more或less选项输入段落，我需要在段落中显示文字。

我认为他们的脚本存在问题，无法找到它，需要帮助来解决这个问题。

Answer 1

问题是您正在使用.text()来读取您要使用的字符串。由于.text()仅提供纯文本而没有任何标记，因此您将丢失<br>生成的nl2br元素。

第一个最明显的解决方案是：为什么不在服务器端拆分文本而不是使用JavaScript？这样，您可以将nl2br分别应用于文本的两个部分。

Javascript解决方案将改为使用.html()，但这很危险，因为您的分割可能发生在<br>标记的中间，您创建了破坏的HTML，例如：

Example<b<span>... </span><a href="#" class="more">More</a><span style="display:none;">r> More Text</span>

正确的JavaScript解决方案是循环遍历.feed-text元素的子元素，包括文本节点（使用.contents()在jQuery中提供）总结字符数以找到合适的分割位置文本。

在切片之后甚至在段落中显示单词

1 个答案: