Seem more..issue (点击see more 5-10次后，操作速度变慢)
Seem more..issue (点击see more 5-10次后，操作速度变慢)
提问于 2012-06-14 13:10:17
Seem more..issue (点击see more 5-10次后，操作速度变慢)
我已经修改过了，请看更多..基于代码的技术在这里http://jsfiddle.net/hgxbf/我面临的问题是在点击了5-10次的See More/See Less之后，操作变得非常慢，并且不能正确地展开/折叠。
<div class="seeMore" /> 由脚本动态添加
HTML结构。
<div class="Blk">
<div class="Title">
Donec at elit sed metus placerat placerat congue ut purus
</div>
<p class="trunc">
Proin ipsum lectus, facilisis sed ornare eget, egestas vel mi. Nullam ac odio arcu. Nunc congue, urna vitae malesuada consequat, leo erat bibendum nunc, et fringilla nibh diam ac tellus. Sed quis ante a ipsum placerat fermentum. Aliquam erat volutpat. Praesent rutrum ornare lectus tincidunt suscipit.
</p>
<div class="seeMore">
<span>SEE MORE</span>
</div>
</div>我的代码http://jsfiddle.net/y4GXL/1/
任何帮助都是非常有用的！
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-06-14 13:55:56
我有一些空闲时间，所以我帮你安排好了。
基本上，您必须保留一个对“看到更多/看到更少”元素的引用，并保留一个状态变量。在click处理程序中，您可以根据状态决定采取行动:折叠还是展开。每次状态更改后，您都会更新"button“文本和状态。
我还应用了更方便的变量命名(所有jquery元素都以美元为前缀)，并使top函数返回.each的结果；否则jQuery链就会断开。
(function($) {
$.fn.truncateText = function(maxWords) {
return this.each(function() {
var $el = $(this),
origText = $el.text(),
truncText = origText.split(' '),
state,
$toggleButton;
// decide whether to place a button
if (truncText.length <= maxWords) {
return;
}
truncText.length = maxWords;
truncText = truncText.join(' ');
// add button and define click handler
$toggleButton = $('<div class="seeMore"></div>')
.insertAfter($el)
.on('click', function() {
if ('open' == state) {
collapse(); // old state was open, so close it
} else {
expand(); // old state was closed, so open it
}
});
function collapse()
{
$el.text(truncText + ' ...');
state = 'closed';
$toggleButton.text('See More');
}
function expand()
{
$el.text(origText);
state = 'open';
$toggleButton.text('See Less');
}
collapse();
});
}
})(jQuery);
$(".trunc").truncateText(4);实际操作：http://jsfiddle.net/y4GXL/6/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11026983
复制相关文章
相似问题
腾讯云开发者
