4

我正在尝试获取许多隐藏的选择元素的宽度。在 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 数据绑定来控制可见性,并且该绑定设置 display: none (http://knockoutjs.com/documentation/visible-binding.html)。

4

3 回答 3

1

它是每边1px的边框。带边框:无;结果是 65。

于 2012-11-28T23:41:14.157 回答
1

这似乎是 jQuery 1.7 中的一个错误,而 jQuery 1.8 中没有:

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

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

于 2012-11-28T23:52:38.660 回答
0

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

于 2012-11-28T23:43:22.740 回答