根据字体大小和字体样式计算字符串的宽度

时间:2014-05-21 08:02:03

标签: jquery html css fonts

我正在尝试根据字体大小和字体样式确定字符串的宽度。
但我不知道该怎么做。我在google上找到了一个函数,我不太明白它是如何工作的。

$.fn.textWidth = function(text, font) {
    if (!$.fn.textWidth.fakeEl) $.fn.textWidth.fakeEl = $('<span>').hide().appendTo(document.body);
    $.fn.textWidth.fakeEl.text(text || this.val() || this.text()).css('font', font || this.css('font'));
    return $.fn.textWidth.fakeEl.width();
};

我测试了这个,得到一个输出,我可以得到字符串的宽度,但如果我声明字体样式和大小怎么办?我不知道怎么做。对这一个有任何想法吗?

1 个答案:

答案 0 :(得分:1)

使用这个:

$.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;
};

来自this主题。