Question

HTML：

<div id="tab">This is a paragraph.</div>
<div id="tab">This is a paragraph.</div>
<div id="tab">This is a paragraph.</div>
<div id="tab">This is a paragraph.</div>

CSS：

#tab{
  height:30px;
  width:130px;
  background-color:red;
}

Jquery：

$(document).ready(function() {
    function randomNumber() {
        return Math.floor(Math.random() * 255)
    }
    $('#tab').mouseover(function() {
        $('#tab').css('background-color', 'rgb(' + randomNumber() + ',' + randomNumber() + ',' + randomNumber() + ')');
    });
    $('#tab').mouseout(function() {
        $('#tab').css('background-color', 'white');
    });
});

我有这个小提琴，我希望颜色变化影响所有#tabs，而不仅仅是第一个，我该怎么做？

Fiddle示例可以在这里找到。

Answer 1

您只能分配一次ID！将其更改为此类http://jsfiddle.net/nHCXV/3/

Answer 2

改为使用班级。然后你可以使用

访问它们

 $('.classname')

Answer 3

您需要将id属性更改为class，因为id是唯一的。试试这是jsfiddle

Answer 4

这是一个正确的小提琴女孩：

http://jsfiddle.net/ToBadForU/9p7ud/

这就是你想要的，对吧？

Answer 5

您可以在没有任何id或div的情况下声明id，而不是提供相同的class，并提供以下代码。要了解有关选择器的更多信息，请转到此link。

$(document).ready(function() {
function randomNumber() {
    return Math.floor(Math.random() * 255)
}
$('div').mouseover(function() {
    $('div').css('background-color', 'rgb(' + randomNumber() + ',' + randomNumber() + ',' + randomNumber() + ')');
});
$('div').mouseout(function() {
    $('div').css('background-color', 'white');
  });
});

或者只是使用class代替id。 Because id's are unique but not classes

你如何将一些脚本应用于具有相同ID的每个css元素？

5 个答案: