`

jQuery获取自动截取过长的文本内容,显示成省略号形式。

 
阅读更多

 

 

table中如果td的内容过多,则会把td撑的很宽, 显得不美观.

如果能让td既美观.也能看到完整的效果..

 

我们则需要,在生成td之前,给指定样式..

这里采用jQuery来实现.

 

具体代码如下:

 

//页面加载之后,设置.样式.
jQuery(function(){
     //使用id选择器;例如:tab对象->tr->td对象.
    $("#high_light tr td").each(function(i){
         //获取td当前对象的文本,如果长度大于25;
         if($(this).text().length>25){
                //给td设置title属性,并且设置td的完整值.给title属性.
	$(this).attr("title",$(this).text());
                //获取td的值,进行截取。赋值给text变量保存.
	var text=$(this).text().substring(0,25)+"...";
                //重新为td赋值;
                $(this).text(text);
         }
      });
});

 

 

下面是HTML代码:

<html>
      <head>
         <title>测试<title>
     </head>
     
      <table id="high_light ">
                  <tr>
                         <td>
这是很长的一段文本内容,测试是否能正常截取.这是很长的一段文本内容,测试是否能正常截取.这是很长的一段文本内容,测试是否能正常截取.这是很长的一段文本内容,测试是否能正常截取.
                        </td>
                  </tr>
      </table>
</html>

 

 

分享到:
评论

相关推荐

    jquery字数超出规定字数自动生成截取生成省略号

    在标题和描述中提到的“jquery字数超出规定字数自动生成截取生成省略号”是指使用 jQuery 实现文本内容超出预设长度时自动进行截断,并在末尾添加省略号的效果。这种功能在显示摘要、标题或者有限空间内的文字信息时...

    网页中字段太长,省略号表示。css显示

    在网页设计中,有时我们需要处理过长的文本字段,使其在有限的空间内显示部分内容并以省略号(...)结尾,以保持页面整洁且易于阅读。这种效果可以通过CSS(层叠样式表)来轻松实现。本文将深入探讨如何使用CSS实现...

    字符串过长CSS截取多余文字并用省略号显示

    在网页设计中,有时我们需要对过长的字符串进行截取,并在结尾处添加省略号以保持布局的整洁和美观。CSS(Cascading Style Sheets)提供了一种优雅的方式来实现这个功能,尤其对于动态生成的内容,如用户昵称或者...

    jQuery截取指定长度字符串代码

    `objString = $(this).text(objString.substring(0,num) + "...")`截取文本至指定长度,并在末尾添加省略号`...`,然后更新`&lt;div&gt;`的文本内容。 最后,`$(document.body).limit();`在文档加载完成后调用`limit`函数...

    js文字超出省略号特效

    在网页设计中,为了美观和用户体验,经常需要对过长的文字进行省略处理,尤其是在有限的空间内展示内容。"js文字超出省略号特效"就是一种利用JavaScript实现文本溢出时添加省略号的技术,它可以帮助我们在不改变HTML...

    jQuery给固定文章字数超出自述以后文字不显示并替换成省略.zip

    1. 获取文章内容:使用jQuery的`.text()`或`.html()`方法获取元素中的文本或HTML内容。 2. 计算字数:通过JavaScript的字符串方法,如`.length`,计算文章的总字符数。 3. 检查字数:如果文章字符数超过了设定值,...

    字符长度计算和长度截取显示

    当列表项中的文本过长时,常常需要对其进行截断并在末尾添加省略号。代码中提供了 `convertStr` 函数来实现这一功能,并且还支持鼠标悬停时显示完整文本的功能。 #### 实现细节 - 如果目标字符串长度超过了指定的...

    jQuery实现控制文字内容溢出用省略号(…)表示的方法

    在jQuery的内容中,除了文本溢出显示省略号的技巧,还提到了一系列与jQuery相关的专题内容,比如《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》...

    html文本溢出显示省略字符的两种常用解决方法

    最后,`overflow:hidden`和`text-overflow:ellipsis`属性分别用于隐藏超出容器的文本内容,并在文本溢出时显示省略号。 以上CSS代码结合使用后,可以在一个容器内实现文本溢出显示省略字符的效果。 方法二:使用...

    jQuery截取指定长度字符串的实现原理及代码

    4. 对超出长度的文本,使用`.substring(0, num)`方法截取前`num`个字符,并添加省略号`...`,然后更新`div`元素的内容。 5. 同时,为了保持完整信息的可访问性,将原始文本内容设置为`div`元素的`title`属性,这样...

    javascript超过容器后显示省略号效果的方法(兼容一行或者多行)

    在Web开发中,文本溢出容器显示省略号的效果是一种常见的需求,尤其是在处理不确定长度的文字内容时。通常,CSS提供了一种简单的解决方案,即通过设置`text-overflow: ellipsis;`属性,可以在文字超出容器宽度时自动...

    CSS(js)限制页面显示的文本字符长度.docx

    这样,当文本内容超过容器宽度时,超出部分将以省略号形式显示。但是,这种方法无法精确控制显示的字符数,只能确保文本在一行内显示,并在超出时添加省略号。 ```css .limited-text { overflow: hidden; text-...

    Jquery循环截取字符串的方法(多出的字符串处理成"...")

    `Jquery循环截取字符串的方法(多出的字符串处理成"...")`这个标题描述了一个常见的需求,即如何在字符串超出特定长度时,用省略号("...")来表示被截断的部分。下面我们将详细介绍如何实现这一功能。 首先,让我们...

    Html长文本超出标记宽度后自动截取实现代码

    总的来说,通过CSS的`white-space`、`overflow`和`text-overflow`属性,我们可以优雅地处理HTML长文本的截取和展示,确保内容在指定宽度内显示,并在超出时自动隐藏,同时提供省略号提示用户有隐藏的内容。...

    jQuery给固定文章字数超出自述以后文字不显示并替换成省略特效代码

    "jQuery给固定文章字数超出自述以后文字不显示并替换成省略号特效代码"就是一种解决此类问题的技术手段。jQuery,作为JavaScript的一个库,提供了丰富的功能来简化DOM操作,使得实现这样的文字截断效果变得更为便捷...

    超出的文字用省略,用…代替.rar

    在JavaScript(JS)编程中,实现“超出的文字用省略号代替”的效果是一种常见的文本处理技术,主要用于在有限的空间内展示长文本。这种效果在网页设计、移动应用和UI开发中非常常见,尤其是在显示文章摘要、标题或者...

    jquery获取tr并更改tr内容示例代码

    这里使用`substring(0,46)`截取前46个字符,并添加省略号("...")表示内容被截断。截取后的字符串再次通过`text()`方法设置回`&lt;td&gt;`元素,完成内容的更新。 HTML部分: ```html ${Warns }" var="Warn"&gt; &lt;!--...

    JQuery获取文本框中字符长度的代码

    文章提到了在获取到字符串长度之后,如何截取字符串并添加省略号等。具体操作可能涉及到字符串的截取、拼接以及DOM元素的更新等。 然后是一个HTML和CSS代码示例,以及一个利用jQuery的插件方法`jQuery.fn.limit`。...

Global site tag (gtag.js) - Google Analytics