jQuery 如何判断文字是否溢出

今天又碰到了这种需求,是因为我们要做个点击获得全文(之类的)功能,设置了overflow:hidden,如果完整的显示了,那么我们就不需要显示全部内容的按钮,否则就要加上。

当时就在想,这玩样儿恐怕不太好办吧?overflow是CSS自动判断的,我完全没有经受,怎么判断确实是个问题。

还好谷歌还是能够找到答案的:jquery如何判断div是否文本溢出
里面提到了一个很好的方法:

$(selector).map(function() {
    if (this.offsetWidth < this.scrollWidth) {
        // do whatever you want
    }
});

这里的offsetWidthscrollWidth是DOM对象所具有的属性,而不是jQuery对象,所以要先转成DOM对象:jQuery与DOM对象的互相转换

关于这两个,以下扩展阅读:
https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/offsetWidth
https://developer.mozilla.org/zh-CN/docs/Web/API/element/scrollWidth

如果您觉得文章不错,可以通过赞助支持我

标签: 知识, 语法, jQuery

添加新评论