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パッケージを追加し、これが解決することhtmljsdomutils期待しましたが、無駄でした。また、Node.jsパッケージjsdomは、デプロイされたMeteorアプリでは機能しないため、追加できません。

私がやろうとしていることを達成する方法はありますか?

4

2 に答える 2

1

これは不可能だと思います。node.jsで実行されているサーバー側のコードは、Webブラウザーのレンダリング環境のコンテキストでは実行されないため、ブラウザーのDOM、使用可能なフォント、および表示構成にアクセスできません。コードを正常に実行して数値を計算したとしても、電子メールを受信したとき、その計算は私のデバイスとは関係ありません。フォント、表示サイズと解像度(デスクトップの場合もあれば、モバイルデバイスの場合もあります)、独自の構成(たとえば、デスクトップのFirefoxで最小フォントサイズを設定)など。代わりに、サイズをem単位で定義してみてください。ピクセルの。

于 2013-03-20T21:47:24.140 に答える
1

クライアント側で何が起こるかを本当に信頼することはできません。Ubuntu と Windows でさえ、異なるヒンティング、アンチエイリアシングのためにフォントが異なって表示され、表示されるサイズに影響を与える可能性があります。

スパンの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 に答える