JQuery 的 width() 不排除隐藏范围内元素的填充

Question

我正在尝试获取许多隐藏的选定元素的宽度。在 JQuery 对象上使用 width（） 返回的宽度是 CSS 定义的宽度，但包括填充。一旦我切换要显示的元素，调用 width（） 就会返回正确的值（即不包括填充/边框/边距的宽度）。

示例 HTML：

<span id="test" style="visibility:hidden">
    <select id="one">
        <option>1</option><option>2</option><option>3</option>
    </select>
</span>

.CSS：

   select {
        width: 80px;
        padding: 0 0 0 15px;
    }

预期宽度：

65，报告宽度：80

这是一个JSFiddle演示我的问题：http://jsfiddle.net/2RH7C/4/

除了设置"可见性：隐藏"（而不是显示：无）或克隆/将对象移出屏幕之外，是否有解决方法？我正在使用 KnockoutJS 数据绑定来控制可见性，并且绑定集显示：none （http://knockoutjs.com/documentation/visible-binding.html）。

Answer 1

这

似乎是jQuery 1.7中的一个错误，在jQuery 1.8中没有发生：

http://jsfiddle.net/2RH7C/5/

如果您没有更新jQuery的选项，那么恐怕"使用屏幕外元素计算"或visibility: hidden方法是您唯一的选择。

Answer 2

边框每

边为 1px。带边框：无;结果为 65。

Answer 3

javascript 是正确的。使用 width（） 已经消除了填充。渲染的宽度实际上是 110px （80+15+15）。