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 相关文章推荐
node.js中的querystring.parse方法使用说明
Dec 10 Javascript
JavaScript使用setInterval()函数实现简单轮询操作的方法
Feb 02 Javascript
原生JavaScript实现动态省市县三级联动下拉框菜单实例代码
Feb 03 Javascript
使用vue.js制作分页组件
Jun 27 Javascript
JS提示:Uncaught SyntaxError: Unexpected token ILLEGAL错误的解决方法
Aug 19 Javascript
总结js中的一些兼容性易错的问题
Dec 18 Javascript
Material(包括Material Icon)在Angular2中的使用详解
Feb 11 Javascript
使用vue-cli创建项目的图文教程(新手入门篇)
May 02 Javascript
vue项目webpack中Npm传递参数配置不同域名接口
Jun 15 Javascript
vue解决一个方法同时发送多个请求的问题
Sep 25 Javascript
js实现GIF图片的分解和合成
Oct 24 Javascript
Vue中父子组件的值传递与方法传递
Sep 28 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
Oracle 常见问题解答
2006/10/09 PHP
PHP利用COM对象访问SQLServer、Access
2006/10/09 PHP
PHP 模拟登陆MSN并获得用户信息
2009/05/16 PHP
PHP中集成PayPal标准支付的实现方法分享
2012/02/06 PHP
注意:php5.4删除了session_unregister函数
2013/08/05 PHP
ThinkPHP中的系统常量和预定义常量集合
2014/07/01 PHP
PHP之sprintf函数用法详解
2014/11/12 PHP
javascript OFFICE控件测试代码
2009/12/08 Javascript
ExtJS PropertyGrid中使用Combobox选择值问题
2010/06/13 Javascript
javascript权威指南 学习笔记之变量作用域分享
2011/09/28 Javascript
JavaScript 5 新增 Array 方法实现介绍
2012/02/06 Javascript
判断js对象是否拥有某一个属性的js代码
2013/08/16 Javascript
js实现回放拖拽轨迹从过程上进行分析
2014/06/26 Javascript
js实现键盘Enter键提交表单的方法
2015/05/27 Javascript
javascript实现支持移动设备画廊
2015/08/24 Javascript
jQuery Easyui 下拉树组件combotree
2016/12/16 Javascript
微信小程序实现导航栏选项卡效果
2020/06/19 Javascript
微信小程序实践之动态控制组件的显示/隐藏功能
2018/07/18 Javascript
vue动态删除从数据库倒入列表的某一条方法
2018/09/29 Javascript
在vue使用clipboard.js进行一键复制文本的实现示例
2019/01/15 Javascript
JavaScript两种计时器的实例讲解
2019/01/31 Javascript
基于JS抓取某高校附近共享单车位置 使用web方式展示位置变化代码实例
2019/08/27 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
python使用正则搜索字符串或文件中的浮点数代码实例
2014/07/11 Python
python如何使用unittest测试接口
2018/04/04 Python
Python pymongo模块常用操作分析
2018/09/01 Python
python 多进程共享全局变量之Manager()详解
2019/08/15 Python
Python爬虫获取op.gg英雄联盟英雄对位胜率的源码
2021/01/29 Python
使用css3制作登录表单的步骤
2014/04/07 HTML / CSS
对教师的评语
2014/04/28 职场文书
高一课前三分钟演讲稿
2014/09/13 职场文书
饭店服务员岗位职责
2015/02/09 职场文书
师范生教育见习总结
2015/06/23 职场文书
写给同事的离职感言
2015/08/04 职场文书
详解运行Python的神器Jupyter Notebook
2021/06/03 Python
Python实现猜拳与猜数字游戏的方法详解
2022/04/06 Python