好的,我已经查阅了jQuery文档(需要有专人维护),在Stack Overflow和Google上也进行了搜索。我找不到这个问题的答案。
简述
过去,我记得jQuery是这样工作的:
$('#myObj').width()
返回#myObj
的计算宽度。
$('#myObj').css('width')
返回在CSS样式表中输入的宽度。
现在,无论我使用哪种方法,任何 jQuery 包都会返回完全相同的数字。
$('#myObj').width()
返回#myObj
的计算宽度作为整数(浮点数?)。
$('#myObj').css('width')
返回#myObj
的计算宽度作为带有px
的字符串。
伪代码
#myobject{
width: 14em;
height: 14em;
}
<div id="myobject">Has Text</div>
<script type="text/javascript">
$( '#myobject' ).click(function(){
alert($(this).css('width') + "\n" + $(this).width());
});
</script>
//Always alerts "224px [newline] 224"
//Expected to alert "14em [newline] 224"
这些基于像素的返回值几乎完全无用,因为我需要根据 CSS 中实际的内容进行计算。例如,我想对元素的 left
位置进行数学运算,但是它却持续返回像素值,在基于 em
的设计中毫无用处。有没有办法在 jQuery 中从 CSS 中获取实际的值?这是一个 jQuery 的 bug 吗,还是我错过了什么?
这里是一个 jsfiddle:http://jsfiddle.net/yAnFL/1/。
解决方案: 显然,这是预期结果。 我决定使用这个插件来进行转换。 剥夺对 CSS 的控制似乎是 jQuery 设计中一个糟糕的选择。