编程 Javascript

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>

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

js获取url参数的使用扩展实例

Dec 29 Javascript

Javascript获取当前时间函数和时间操作小结

Oct 01 Javascript

Bootstrap布局组件教程之Bootstrap下拉菜单

Jun 12 Javascript

微信小程序教程之注册程序

Oct 17 Javascript

在vue.js中抽出公共代码的方法示例

Jun 08 Javascript

微信小程序实现传参数的几种方法示例

Jan 10 Javascript

jQuery实现的鼠标响应缓冲动画效果示例

Feb 13 jQuery

mpvue构建小程序的方法(步骤+地址)

May 22 Javascript

在react中使用vuex的示例代码

Jul 30 Javascript

使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能

Oct 18 Javascript

微信小程序公用参数与公用方法用法示例

Jan 09 Javascript

Vue的click事件防抖和节流处理详解

Nov 13 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