.val（）四舍五入？

Question

我正在尝试将#value_box的值显示为100.5，但它会继续四舍五入。有谁知道我能做些什么让它显示小数位？

jsfiddle

<input type="text" id="the_box" style="width:100.5px" value="" />
<input type="text" id="value_box" value="" />

//returns 101
$("#value_box").val($("#the_box").css('width').replace('px', ''));

Answer 1

它的.css('width')轮次。除了.css之外，jQuery中的getComputedStyle还有很多。 Comparison

对于.css('width')，jQuery使用offsetWidth [source]：

val = name === "width" ? elem.offsetWidth : elem.offsetHeight,

在CSS中，像素只是另一个单位，定义为1/96英寸。对他们来说，没有什么本质上是不可或缺的。在高DPI显示器中，例如移动屏幕，较新的笔记本电脑和印刷媒体，使用像素的像素是有意义的。＆＃34;但offsetWidth被定义为整数值[CSSOM]：

readonly attribute long offsetWidth;

在这种情况下，您在内联样式中明确设置了width，并且想要获得它，您可以做的一件事就是使用纯DOM来获取它：

$("#the_box")[0].style.width.replace('px', '')

example

您还可以尝试使用getBoundingClientRect [CSSOM]并向后处理边框和填充引入的更改。此方法返回一个DOMRect对象，其中的信息表示为浮点数[geometry]。

$("#the_box")[0].getBoundingClientRect().width - ...