0

我需要能够将这个插件与“max-height”css一起使用，现在它只有在我定义了一个确定的高度时才有效，但如果它有 max-height 则不行。有没有办法让这项工作也能奏效？

(function($) {
        $.fn.ellipsis = function()
        {
                return this.each(function()
                {
                        var el = $(this);

                        if(el.css("overflow") == "hidden")
                        {
                                var text = el.html();
                                var multiline = el.hasClass('multiline');
                                var t = $(this.cloneNode(true))
                                        .hide()
                                        .css('position', 'absolute')
                                        .css('overflow', 'visible')
                                        .width(multiline ? el.width() : 'auto')
                                        .height(multiline ? 'auto' : el.height())
                                        ;

                                el.after(t);

                                function height() { return t.height() > el.height(); };
                                function width() { return t.width() > el.width(); };

                                var func = multiline ? height : width;

                                while (text.length > 0 && func())
                                {
                                        text = text.substr(0, text.length - 1);
                                        t.html(text + "...");
                                }

                                el.html(t.html());
                                t.remove();
                        }
                });
        };
})(jQuery);
4

2 回答 2

0

看起来我们可以创建一个新变量来检查 maxHeight 属性是否存在，但我们需要清理它。

var myHeight = (el.css('maxHeight')) ? el.css('maxHeight').split('px')[0] : el.height();

如果有一个 maxHeight，我们会得到一个类似 的值500px，我们不想要px，所以我们拆分了字符串并取了数组的第一部分，它是原始整数。

现在我们可以替换el.height()为myHeight，如果可用，您将获得 maxHeight，否则您将获得 height 属性。

于 2012-10-26T23:46:34.273 回答
0

问题似乎是在 jQuery 的 height() 中没有考虑最大高度。我通过更改插件以接受 max_height 参数而不是在 css 中执行 max-height 来使其工作：

$.fn.ellipsis = function(max_height)

然后改变高度函数：

function height() { return t.height() > max_height; };

不是超级优雅，但它说明了问题。

顺便说一句，上面的原始代码来自这里：https ://stackoverflow.com/a/1022672/986840

于 2014-04-25T06:00:12.707 回答