Question

我正在使用以下代码将悬停效果应用于名为toolbar的div中的一组图像：

$("#toolbar img").hover(
    function()
    {
        this.src = this.src.replace("_off", "_on");
    },
    function()
    {
        this.src = this.src.replace("_on", "_off");
    }
);

但是我也希望将相同的效果应用于名为tabs的div，而不重复相同的代码。我不能沿着这些方向做点什么：

$("#toolbar, #tabs img").hover(
    function()
    {
        this.src = this.src.replace("_off", "_on");
    },
    function()
    {
        this.src = this.src.replace("_on", "_off");
    }
);

问题是以上只适用于“tabs”div，而工具栏则停止工作。我想我只是把jQuery语法弄错了，仍然是jQuery的新手

Answer 1

您可以像逗号一样用逗号分隔多个选择器。如果要重新创建第一个示例中的效果，则需要：

$("#toolbar img, #tabs img")

'＃toolbar img'是整个选择器。它说“将此应用于任何具有工具栏ID的父元素中的img标记”。 E.g：

<div id ="toolbar">
   <img .../>
   <img .../>
</div>

#tabs img，是另一个选择器。

这些语法与CSS选择器的语法相同，因此有关研究的更多信息。

Answer 2

尝试$("#toolbar img, #tabs img")。

Answer 3

不应该有“#toolbar img，＃tabs”而不是“#toolbar，＃tbs img”？

如何在jQuery中使用多个选择器？

3 个答案: