用jQuery控制内容长度超出规定长度显示省略号
长度超出规定长度，显示省略号
设置class为displayPart，
设置自定义属，displayLength可显示长度（不包含...），双字节字符，长度 *2，
代码如下:
<script type="text/javascript">
$.fn.extend({
displayPart:function () {
var displayLength = 100;
displayLength = this.attr("displayLength") || displayLength;
var text = this.text();
if (!text) return "";
var result = "";
var count = 0;
for (var i = 0; i < displayLength; i++) {
var _char = text.charAt(i);
if (count >= displayLength) break;
if (/[^x00-xff]/.test(_char)) count++; //双字节字符，//[u4e00-u9fa5]中文
result += _char;
count++;
}
if (result.length < text.length) {
result += "...";
}
this.text(result);
}
});
$(function () {
$(".displayPart").displayPart();
});
</script>
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<h2>hello world</h2>
<div style="width:500px;">
hello worldhello worldhello worldhello worldhello worldhello worldhello worldhello worldhello worldhello worldhello worldhello world!!!
</div>
<hr>
<h2>hello</h2>
<div class="displayPart" displayLength="40"> hello worldhello worldhello worldhello worldhello worldhello worldhello worldhello worldhelloworldhello worldhello worldhello worldhello worldhello worldhello world
</div>
</body>
</html>
相关文章
- js实现一个代码简洁、逻辑不复杂的多级树 级联(2014-5-24 13:59:44)
- 用jquery怎么实现一个文章的自定义分段显示功能(2014-5-24 13:48:53)
- 用jquery怎么判断表格同一列不同行input数据是否重复(2014-5-15 19:7:22)
- js判断是否按回车键并兼容各种浏览器(2014-5-14 12:6:22)
- javascript实现图片拖动改变顺序例子（带效果图）(2014-5-14 11:58:30)
- [例子]jQuery EasyUI 数字格式化处理(2014-5-13 14:26:38)
- 分享jQuery EasyUI 日期控件如何控制日期选择区间(2014-5-13 14:22:53)
- 用jquery插件来实现定时查询待处理任务数量(2014-5-9 14:41:34)
- javascript实现checkbox全选和反选的例子(2014-5-9 14:31:36)
- 分享jquery实现等待效果例子(2014-5-9 14:13:42)
