3

这是一个<select>元素：

<select>
    <option>Hello</option>
    <option>Banana</option>
    <option>Balloon</option>
    <option>Something</option>
    <option>Potato</option>
    <option>Cleveland</option>
</select>

这里有一点 JavaScript（一个 jQuery “就绪”处理程序）：

$(function() {

    function foo() {
        var s = $('select').find(':selected');
    }

    setInterval(foo, 200);
});

这是这个问题的jsfiddle。.

处理程序设置一个间隔计时器，每 200 毫秒，找到当前选择<option>的<select>，并且什么都不做。当我在 Chrome (13.0.782.112) 中运行小提琴时，我单击<select>元素，然后尝试选择一个条目，选择突出显示一直跳回第一个选定的元素。当然，我可以单击显示的任何<option>元素并且有效，然后下次它会执行相同的操作。

现在，如果我更改计时器处理程序，使其不使用 jQuery 来查找当前选定的<option>元素，如下所示：

$(function() {

    function foo() {
        var select = $('select')[0];
        var s = $(select.options[select.selectedIndex]);
    }

    setInterval(foo, 200);
});

然后我不再看到效果。

Firefox 不这样做。我还没有尝试过 Safari。

就我个人而言，我认为这里有什么地方做错了。是铬吗？jQuery？

编辑——更多细节——我在 Linux 上运行 Chrome。我将在几秒钟内尝试 Windows。（在 Windows 中编辑相同。）

4

1 回答 1

3

将代码更改为：

function foo() {
    var s = $('select option:selected');
}

setInterval(foo, 200);

不知道为什么它会这样做，但我的猜测是它与伪选择器在 jQuery 中的工作方式有关。它们被实现为与选择器名称配对的函数（在本例中为“已选择”）。因此，它们针对上下文中的每个可能元素（不仅仅是那些可能被选择的元素）运行。

也许有某种奇怪的幽灵元素，当它不应该执行“选定”伪选择器时。这里的解决方案是在执行伪选择器之前将上下文限制为选项。总是一件好事。

于 2011-08-24T23:41:32.660 回答