找到一個文本的長度，這是顯示在div元素已溢出隱藏

Question

 some text is here in div element like this

div {width：100px; overflow：hidden; height：20px;}

現在，我只想得到可見文本的長度，不是整個div元素的文本。

我怎樣才能做到這一點？

感謝

Answer 1

你爲什麼不限制你的文本框沒有。輸入的字符。你訪問一個演示，你可以檢查沒有。的字符輸入並放了一個限制 click here 相同的功能，你可以impliment和使用它爲你的目的。

Answer 2

我發現這個問題很有趣，所以我設計了一種有效測量可見文本字符長度的方法。

你可以有測試：http://jsfiddle.net/6nYFb/

的想法是反覆填寫的文字寬度100像素，直至達到。

CSS：

#txt{ max-width:100px; overflow:hidden;height:20px;}​ 

HTML：

<span id=txt>My long text is long. My long text.My long text. My long text... My long text. My long text, so long...</span> 
<br>Nb chars : <span id=mes></span>​ 

JS：

var text = $('#txt').text(); 
var nbchars = 0; 
$('#txt').html(''); 
var increment = function() { 
    $('#txt').html(text.substring(0, nbchars)); 
    if (nbchars<text.length-1 && $('#txt').width()<100) { 
     nbchars++; 
     window.setTimeout(increment, 1); 
    } else { 
     $('#mes').html(nbchars); 
    } 
}; 
window.setTimeout(increment, 1); 

當然，最好不要過度使用這種解決方案，但我看不到任何東西更沒有畫布的直接。它的工作原理。

另（較小兼容）的解決方案可能是在內存中的畫布使用，而不是修改DOM，但一些文本的轉換（或：之前）的CSS可能是難以重現定義...