请查看此代码:CODE
此代码在jsfiddle.net中工作,但不能在本地工作 本地的js代码, 此代码显示和隐藏更少的文本
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var maxheight=118;
var showText = "More";
var hideText = "Less";
$('.textContainer_Truncate').each(function () {
var text = $(this);
if (text.height() > maxheight){
text.css({ 'overflow': 'hidden','height': maxheight + 'px' });
var link = $('<a href="#">' + showText + '</a>');
var linkDiv = $('<div></div>');
linkDiv.append(link);
$(this).after(linkDiv);
link.click(function (event) {
event.preventDefault();
if (text.height() > maxheight) {
$(this).html(showText);
text.css('height', maxheight + 'px');
} else {
$(this).html(hideText);
text.css('height', 'auto');
}
});
}
});
});
</script>
htm代码:
<div class="textContainer_Truncate">
<p>content<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
hello<br>
</p>
</div>
文件夹内容: index.htm和jquery-1.8.2.min.js 如何在本地使用此代码?
答案 0 :(得分:3)
我试图复制你所做的事情,发现它工作正常但没有错误。
考虑下载此解决方案(一个文件夹包含一个index.html页面,旁边有jquery 1.8.2.js文件)。 也许你已经做了一些额外的事情 Test Project
更新:我在复制代码时发现了一些问题,代码中有一个额外的问号,请看下面的图片