4

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;
}

查询：

$(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，而不仅仅是第一个，我该怎么做？

小提琴示例可以在这里找到。

4

5 回答 5

2

您只能分配一个 ID 一次！将其更改为像这样的类http://jsfiddle.net/nHCXV/3/

于 2012-09-20T09:12:40.543 回答
1

改用一个类。然后您可以使用

 $('.classname')
于 2012-09-20T09:12:54.507 回答
1

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

于 2012-09-20T09:15:00.253 回答
1

这是一个小提琴女巫的正确方法：

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

这就是你想要的，对吧？

于 2012-09-20T09:17:56.390 回答
0

您可以在没有任何' 或的情况下id声明' ，而不是给出相同的 '，并给出下面的代码。要了解有关选择器的更多信息，请访问此链接。dividclass

$(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's。 因为 id 是唯一的，但不是 classes。

于 2012-09-20T09:13:12.377 回答