4

我试图在我的服务器上使用以下代码来估计一些文本字段的长度，并在通过电子邮件发送它们之前可能会修剪它们......

String.prototype.visualLength = function()
{
    var element = document.createElement("span");
    element.css({
        "visibility": "hidden",
        "white-space": "nowrap",
        "font-weight": "normal",
        "font-size": "18px",
        "line-height": "40px",
        "font-family": "Helvetica, Arial, sans-serif",
        "text-decoration": "none"
    });
    document.body.appendChild(element);
    element.innerHTML = this;
    return element.offsetWidth;
};

String.prototype.trimToPx = function(length)
{
    var tmp = this;
    var trimmed = this;
    if (tmp.visualLength() > length)
    {
        trimmed += "...";
        while (trimmed.visualLength() > length)
        {
            tmp = tmp.substring(0, tmp.length-1);
            trimmed = tmp + "...";
        }
    };
    return trimmed;
};

显然我收到一个错误，因为“文档”没有在服务器端定义。我添加了 Meteor 包htmljs，domutils希望他们能解决这个问题，但徒劳无功。而且我无法添加 Node.js 包jsdom，因为显然它在部署的 Meteor 应用程序中不起作用。

知道如何实现我想要做的事情吗？

4

2 回答 2

1

我不认为这是可能的。在 node.js 中运行的服务器端代码不在 Web 浏览器渲染环境的上下文中运行，因此无法访问浏览器的 DOM 以及可用的字体和显示配置。即使您成功运行代码并计算了一个数字，当我收到您的电子邮件时，该计算与我的设备无关。字体、显示尺寸和分辨率（可以是台式机，也可以是移动设备）、我自己的配置（例如，我在我的台式机上的 Firefox 中设置了最小字体大小）等。而是尝试以em单位来定义您的尺寸的像素。

于 2013-03-20T21:47:24.140 回答
1

你不能真正依赖客户端会发生什么。即使是 Ubuntu 和 Windows，由于不同的提示、抗锯齿，它们也会显示不同的字体，并且它们可能会对显示的大小产生影响。

如果您将 span 的 css 修改如下，当它的文本大于所需空间时，无论如何，剩余的将显示为...

max-width: 10%;
border: 1px #000 solid; // JUST TO SEE the effect clearly
width: 10%;
overflow: hidden;
height: 20px;
text-overflow: ellipsis;
display: block;
white-space: nowrap;

**请注意，您需要一个合适的高度值，否则文字会落到底部，无法实现您想要的。

试试http://jsfiddle.net/sG6H2/

于 2013-03-20T22:19:53.013 回答