使用javascript查看更多

时间:2012-03-28 12:33:41

标签: php javascript template-lite

我从我的数据库中检索评论并显示带有字符限制的评论,直到105

我使用此代码<td>{$users.COMMENT|truncate:105:"..."}</td>

我想要的是,如果评论大于105,则截断为105个字符并放入复选框。如果不放入复选框。

如果用户单击该复选框,行将更大,用户将看到完整的评论。

我该怎么做?

3 个答案:

答案 0 :(得分:1)

最简单的方法是使用隐藏元素。

<td>
 <span class='comment_short'>{$users.COMMENT|truncate:105:"..."}</span>
 <span class='comment_full' style='display:none'>{$users.COMMENT}</span>
</td>

然后,当您单击该复选框时,您可以切换每个元素的可见性。

答案 1 :(得分:1)

HTML代码:

 <div id="container">
     <input type="checkbox" onclick="javascrpt: $('#container').toggleClass('active')">
     <div class='comment_short'>short comment </div >
     <div class='comment_full'>very loooooong comment very loooooong comment  very loooooong comment  very loooooong comment </div >
</div>

CSS代码:

div#container.active div.comment_full {
    display: block;
}

div#container div.comment_full {
    display: none;
}

这里是示例http://jsfiddle.net/guTMs/1/

答案 2 :(得分:0)

将剩余文字放在<span style="display:none" id="more_text">标签中,然后在更多按钮上写下:

<button name="more" value="more" onclick="document.getElementById('more_text').style.display = 'block'">