5

问题很简单：

使用tinyMCE，我将 html 数据存储到数据库中。然后在主页上，我展示了我插入数据库的 5 篇最新帖子。如果它们超过它，我想将每个帖子裁剪到指定的长度并放置一个continue reading链接（这里可以是软裁剪，不必是刚性的）。

用 php 的函数裁剪字符串很容易，wordwrap但由于字符串是由 html 组成的，我不想通过从错误的地方裁剪它来破坏 html 代码。

所以问题是：有没有一种简单的方法来裁剪它（也可以是 css、javascript 解决方案）或者我是否编写了一个包含大量检查的长函数来实现这样一个基本功能？我正在考虑使用该DOM课程，但在创建功能之前，我只想问你们。

编辑

造型对我来说很重要。所以没有可能剥离标签。

提前致谢。

4

2 回答 2

2

一种可能的解决方案是去掉标签，如果这个 HTML 的样式不是很重要，那么你可以随意剪切：http: //php.net/manual/es/function.strip-tags.php

CSS3 浏览器的另一个解决方案是使用 text-overflow，阅读更多相关信息： http ://davidwalsh.name/css-ellipsis

于 2013-03-29T18:10:11.133 回答
0

假设你使用 jQuery

javascript

     $(function () {
        $('p').filter(function () {
           return $(this).height() > 50;
        }).addClass('collapsed').css('position', 'relative').append('<a href="#" class="expand">read more</a>');
        $('.expand').on('click', function(){
           if($(this).parents('.collapsed').length)
              $(this).parents('.collapsed:first').removeClass('collapsed')
           else
              $(this).parents(':first').addClass('collapsed')

        })
     })

的CSS

.collapsed{overflow: hidden; height: 20px; margin-bottom: 10px; position: relative}
.expand{position: absolute; right: 0; bottom: 0; background: #fff; padding: 0 0 0 15px;}

只是一个概念证明。需要JS优化

于 2013-03-29T18:57:32.973 回答