jQuery获取当前点击元素及css text-overflow 文字显示不完全-网站建设-郑州通力网络技术有限公司

jQuery获取当前点击元素id或其他信息方法

可以通过$(this).attr(属性名)获取前点击或者滑过的元素节点的ID和其它属性方法

如下代码可以实现点击页面获得被点击元素的id

$(document).click(function(e) { // 在页面任意位置点击而触发此事件

$(e.target).attr("id"); // e.target表示被点击的目标

})

弹出当前点击元素节点的ID值

$('div').click(function(e){

alert($(this).attr('id'));

//alert($(e.target).attr('id'));

});

css text-overflow 文字显示不完就输出省略号......

通过css的text-overflow属性设置成ellipsis,就可以实现文字标签内显示不完就自动显示省略号......。能够显示完就不显示省略号；NOBR标签可以让文字一行显示而不分行。也可以通过css white-space: nowrap设置文字不换行，

有时为了避免文本文字内容超出一定宽度后溢出，我们想要溢出的部分不显示但用省略号（...）显示，这个时候我们可以使用CSS text-overflow文本溢出省略号属性样式实现。

一、text-overflow省略号样式语法结构 text-overflow语法： text-overflow : clip | ellipsis text-overflow参数值和解释： clip : 　不显示省略标记（...），而是简单的裁切 ellipsis : 　当对象内文本溢出时显示省略标记（...） text-overflow应用说明： CSS text-overflow设置或检索是否使用一个省略号标记（...）标示对象内文本文字的溢出。要想实现显示不完内容将显示省略号代替，还需要html nobr标签完成（nobr禁止换行标签）

在web开发过程中，常常会遇到要让布局中的某些文本根据宽度来显示，如果超过最大宽度仍然显示不完的，就显示为省略号的情况，添加下面的CSS样式表就能实现这种效果，但是这种效果只适用于单行显示的文本。

首先给用于放文本的标签元素设置一个宽度值，并设置溢出属性overflow为溢出隐藏。

width: 245px;

overflow: hidden;

设置文本缩略的样式为"..."

white-space: nowrap;

text-overflow: ellipsis;

例子

<!DOCTYPE html>

<head>

<title>text-overflow案例在线演示</title>

*{ padding:0; margin:0}