1

我正在使用一个名为Autoellipsis的 jQuery 插件。

它在具有固定高度的文本末尾添加“...”。

例如:

带省略号和高度:

<div style="height 20px;">

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat...

</div>

没有省略号和高度:

<div>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam dolore magna aliquam erat volutpat。

</div>

要应用省略号,您只需执行此操作(仅当元素具有高度时才应用省略号):

  // Apply ellipsis
  $j('.reply-content p').ellipsis();

HTML:

<div class="reply-content">
<span class="topic-author-link">
<span class="topic-post-date">
<span class="bbp-admin-links">
<p>
<div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam dolore magna aliquam erat volutpat.</div>
</p>

<!-- etc... -->

我想添加一个阅读更多按钮:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat euismod tincidunt ut laore tincidunt ut laoreet...阅读更多

因此,当您单击省略号后的“阅读更多”链接时,将显示全文(例如,仅保留两行文本)。

有什么建议可以做到这一点吗?

编辑:

插件选项(以防万一):

.ellipsis([选择器],[选项])

对 jQuery 选择执行省略号。可选选择器定义将受省略号操作影响的子元素。selector 选择子元素以执行省略号的选择器。如果没有给出选择器,插件默认对所有子元素执行省略号。options 要传递给方法的附加选项的映射。支持的是:

ellipsis要使用的省略号字符或字符串。默认为“...”(三个点)。

setTitle将受影响元素的标题属性设置为原始内容。可以设置为 never、onEllipsis 或 always。使用 onEllipsis 时,仅当元素的内容确实被省略时才会设置 title 属性。默认为从不。

live设置为 true 时,对匹配 jQuery 选择的当前和未来元素执行省略号。当目标元素的尺寸发生变化时,也会重新应用省略号。请小心使用,因为此模式会轮询选择元素。默认为假。

该方法返回用于链接目的的 jQuery 对象。

4

1 回答 1

1

从插件的源码来看,设置对象如下所示:

var defaultSettings = {
  ellipsis: '...',
  setTitle: 'never',
  live: false
};

所以该ellipsis选项实际上不是一个字符,而是(默认情况下)三个字符。快速浏览一下代码并没有发现任何使用魔法数字 3 的明显位置,因此您很有可能只需提供不同的ellipsis选项,例如

ellipsis : ' <a href="something">Read More...</a>';

当然,事情可能会破裂,但这是一个开始。

于 2011-08-19T07:03:36.120 回答