HTML长文本截取含有HTML代码同样适用的两种方法


Posted in Javascript onJuly 31, 2013

方法一:用CSS截断字符串:IE,FireFox,Opera ,Safari都兼容

.subLongText{ 
width:150px; 
height:24px; 
overflow:hidden; 
white-space:nowrap; 
text-overflow:ellipsis; 
text-overflow: ellipsis;/* IE/Safari */ 
-ms-text-overflow: ellipsis; 
-o-text-overflow: ellipsis;/* Opera */ 
-moz-binding: url("ellipsis.xml#ellipsis");/*FireFox*/ 
} 
<span class="subLongText">任意长度文本</span>

方法二:用js截取
<HTML> 
<HEAD> 
<TITLE>JQUERY 文本截取方法</TITLE> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<script type="text/javascript" src="jquery-1.3.2.js"></script> 
<script type="text/javascript"> 
$.fn.substr = function(length,content){ 
$(this).each(function(i,item){ 
var val=$(item).html(); 
if(!val) return; 
if(val.length>length) { 
val = val.substring(0,length); 
val += content || "..." 
$(item).html(val); 
} 
}); 
} 
function subTdContent(){ 
$('td').substr(20); 
} 
</script> 
</HEAD> 
<BODY onload="javascript:subTdContent();"> 
<table style="border:1px solid #b3c0f5;" border="1"> 
<tr> 
<td>我是代码:$.fn.substr = function(l,c){ $(this).each(function(i,item)</td> 
<td>以下两种方式都可以解决textarea行高自动适应类容的高度</td> 
<td>以下两种方式都可以解决textarea行</td> 
</tr> 
</table> 
</BODY> </HTML>
Javascript 相关文章推荐
asp批量修改记录的代码
Jun 25 Javascript
javascript iframe内的函数调用实现方法
Jul 19 Javascript
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果
Jul 03 Javascript
Javascript实现div层渐隐效果的方法
May 30 Javascript
浅谈JavaScript中的string拥有方法的原因
Aug 28 Javascript
Bootstrap选项卡与Masonry插件的完美结合
Jul 06 Javascript
基于js 本地存储(详解)
Aug 16 Javascript
详解React+Koa实现服务端渲染(SSR)
May 23 Javascript
微信小程序用户信息encryptedData详解
Aug 24 Javascript
原生JS实现的放大镜特效示例【测试可用】
Dec 08 Javascript
koa router 多文件引入的方法示例
May 22 Javascript
vue各种事件监听实例(小结)
Jun 24 Javascript
JS的千分位算法实现思路
Jul 31 #Javascript
一个JS的日期格式化算法示例
Jul 31 #Javascript
jquery实现div拖拽宽度示例代码
Jul 31 #Javascript
JS 获取浏览器和屏幕宽高等信息的实现思路及代码
Jul 31 #Javascript
javascript获取下拉列表框当中的文本值示例代码
Jul 31 #Javascript
禁用页面部分JavaScript方法的具体实现
Jul 31 #Javascript
jquery 单引号和双引号的区别及使用注意
Jul 31 #Javascript
You might like
推荐php模板技术[转]
2007/01/04 PHP
php时间戳格式化显示友好的时间函数分享
2014/10/21 PHP
Yii的Srbac插件用法详解
2016/07/14 PHP
smarty模板数学运算示例
2016/12/11 PHP
Windows平台PHP+IECapt实现网页批量截图并创建缩略图功能详解
2019/08/02 PHP
javascript 表单规则集合对象
2009/07/21 Javascript
jquery插件制作 表单验证实现代码
2012/08/17 Javascript
jQuery 中国省市两级联动选择附图
2014/05/14 Javascript
javascript删除一个html元素节点的方法
2014/12/20 Javascript
jquery获取form表单input元素值的简单实例
2016/05/30 Javascript
AngularJS创建自定义指令的方法详解
2016/11/03 Javascript
jQuery移除或禁用html元素点击事件常用方法小结
2017/02/10 Javascript
JS html时钟制作代码分享
2017/03/03 Javascript
WebSocket实现简单客服聊天系统
2017/05/12 Javascript
JS查找数组中重复元素的方法详解
2017/06/14 Javascript
vue-cli3 从搭建到优化的详细步骤
2019/01/20 Javascript
解决vue单页面多个组件嵌套监听浏览器窗口变化问题
2020/07/30 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
2020/11/16 Javascript
解决vue-cli输入命令vue ui没效果的问题
2020/11/17 Javascript
[01:43]3.19DOTA2发布会 三代刀塔人第三代
2014/03/25 DOTA
[15:56]Heroes18_暗影萨满(完美)
2014/10/31 DOTA
[50:24]VGJ.S vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python基于回溯法子集树模板解决取物搭配问题实例
2017/09/02 Python
机器学习的框架偏向于Python的13个原因
2017/12/07 Python
Python中常用的内置方法
2019/01/28 Python
python动态进度条的实现代码
2019/07/03 Python
Python CVXOPT模块安装及使用解析
2019/08/01 Python
Python 解码Base64 得到码流格式文本实例
2020/01/09 Python
python3正则模块re的使用方法详解
2020/02/11 Python
Pycharm新手使用教程(图文详解)
2020/09/17 Python
Jmeter调用Python脚本实现参数互相传递的实现
2021/01/22 Python
CSS3感应鼠标的背景闪烁和图片缩放动画效果
2014/05/14 HTML / CSS
清华大学自主招生自荐信
2014/01/29 职场文书
放飞梦想演讲稿200字
2014/08/26 职场文书
迎国庆演讲稿
2014/09/05 职场文书
mysql sql常用语句大全
2022/06/21 MySQL