字符串截斷動態設置

我正在使用Symfony2，Twig和Twitter Bootstrap。我還沒有找到任何解決方案，以解決以下問題。字符串截斷動態設置

在我的web應用程序的某些部分，我使用提交顯示的比較（使用百分比）。

對於那些太長，不適合在「保留」空間對他們來說領域的那些價值，我使用截斷字符串枝條或Javascript功能，使他們能夠適當地配合。現在的問題是：

有沒有什麼辦法，以使該截斷的長度根據顯示的寬度動態設置？請注意，由於表格在窗口大小調整時動態顯示和重置，因此這些寬度將隨時更改。

任何方式動態地截斷字符串？

一些代碼塊我使用：

TWIG：

JAVASCRIPT：

// Truncates a string and adds "..." 
function truncate_string(str, len){ 
    if (str.length > len) 
     return str.substring(0, len) + "..."; 
    else 
     return str; 
}

的解決方案將是動態地設置，根據的寬度len參數TD以及要顯示的字符串的寬度。

根據字體大小和類型在我們知道通過jQuery的，CSS或什麼的，一個字符串的準確寬度？或者換句話說，我們如何知道一個字符串的最大數量將能夠具有一定的像素寬度？

來源

2012-11-07 ElPiter

嘗試使用隱藏的div用於確定文本寬度：http://stackoverflow.com/a/118251/1538708 – adamb

有一個jQuery plugin做什麼你問。除JavaScript之外，這是無法實現的。也許一個CSS嚮導可能能夠通過使用overflow和after屬性來構建解決方案。通過我的判斷，如果你有附加的元素每個字符串一個固定的字符串（滿弦永遠不會被顯示），只會工作。

還檢查了該older SO answer這是關係。

來源

2012-11-07 19:37:17

可以extend twig filter創建自己的過濾器或編輯CSS樣式/ HTML這樣

CSS：

table td{ 
    position:relative; 
    overflow:hidden; 
} 
table td > span{ 
    display: inline-block; 
    position:relative; 
    height: 18px; 
    min-width: 200px; 
}

HTML：

<table> 
<tr> 
    <td><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet ante magna, non pretium sem. </span></td> 
    <td><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet ante magna, non pretium sem. </span></td> 
</tr> 
<tr> 
    <td><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet ante magna, non pretium sem. </span></td> 
    <td><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc imperdiet ante magna, non pretium sem. </span></td> 
</tr>

所以，你的TD內容自動調整大小，不需要截斷文本。

來源

2012-11-07 21:08:26

字符串截斷動態設置

回答

相關問題