Question

我有以下HTML代码：

<html>
  <head>
    <title>Cheeses</title>
  </head>
  <body>
    <select name="multi" id="multi" multiple="multiple">
        <option selected="selected" label="emmental">Emmental</option>
        <option label="roquefort" >Roquefort</option>
        <option label="parmigiano">Parmigiano</option>
        <option label="cheddar">Cheddar</option>
    </select>
  </body>
</html>

在IE中的JavaScript中，如何获取其中一个<option>元素的尺寸和位置？执行以下操作无效：

var selectEl = document.getElementById("multi");
var options = selectEl.getElementsByTagName("option");
var rect = options[1].getBoundingClientRect();

返回一个rect，但是对于rect的所有属性它都为零。我更喜欢直接的JavaScript解决方案，不依赖于像JQuery这样的库，但如果必须，我会接受JQuery的答案。

Answer 1

选项不具有任何尺寸，包含的选择元素具有宽度＆amp;高度。

var width = select.style.width
var height = select.style.height

计算屏幕位置比较棘手，因为您可以计算父元素的偏移宽度和高度。

jQuery具有解决这些值的方法，但它们并不总是那么准确。

在IE中，如何在<select>元素中找到<option>元素的坐标？</select> </option>

1 个答案: