如何獲得空白的寬度？

Question

我有一個函數切串到一個準確的寬度，我們稱這種cut()

cut('abcd',3) = 'abc'

中font-family我用的是Arial

但是當我計算出每個系統字符的寬度，我發現whitespace很奇怪。

<span id='x'> </span> 

當我使用$("#x").width()我得到了0.0

注意whitespace不&nbsp

爲什麼' ' = 0.0但'a b' that ' ' != 0.0

什麼的whitespace在HTML規則？

Answer 1

您可以使用white-space: pre;強制空間來呈現，因爲它們可以寫成：

#x { 
    white-space: pre; 
} 

我獲得寬度4px：http://jsfiddle.net/qgeUZ/1/

Answer 2

試試這個，因爲這裏特色：Calculating text width

$.fn.textWidth = function(){ 
     var html_org = $(this).html(); 
     var html_calc = '<span>' + html_org + '</span>'; 
     $(this).html(html_calc); 
     var width = $(this).find('span:first').width(); 
     $(this).html(html_org); 
     return width; 
    }; 

//切換功能