jQuery .css 不添加 display:block;对于所有 div答案

【问题标题】：jQuery .css does not add display:block; for all divsjQuery .css 不添加 display:block;对于所有 div
【发布时间】：2014-04-20 09:32:12
【问题描述】：

您好，jQuery 脚本不会为所有相同的鬃毛 div 添加显示块，仅适用于第一个。

$("#sidecontrol_container").mouseenter(function(){
    setTimeout( function(){
    $('#packet_name').css('display','block');
       },310);
$( "#sidecontrol_container" ).animate({
        width:"230px"
    }, 300 );       
});
$("#sidecontrol_container").mouseleave(function(){
    $('#packet_name').css('display','none');
    $( "#sidecontrol_container" ).animate({
        width:"40px"
    }, 300 );   
});

HTML

<div id="sc_wraper">
    <div id="packet_name">1</div>
</div>

<div id="sc_wraper">
    <div id="packet_name">1</div>
</div>

CSS

#packet_name{
    height:40px;
    width:190px;
    float:right;
    display:none;
}

它只为名称为 packet_name <div id="packet_name" style="display:block;">1</div> 的第一个 div 添加

鼠标进入后的 HTML 结果

<div id="sc_wraper">
        <div id="packet_name" style="display:block;">1</div>
    </div>

    <div id="sc_wraper">
        <div id="packet_name">1</div>
    </div>

【问题讨论】：

您需要改用 div 类，ID 仅适用于页面上的单次出现。然后适当调整你的jQuery
@robobobobo 为什么不将其添加为答案？您的建议似乎对 Vadimas 有效。
好的，jsve，现在添加，谢谢

标签： jquery html css

【解决方案1】：

之所以只更改第一个，是因为 jQuery 只选择 div 名称的第一个实例，因为它是一个 ID。

如果您想更改多个同名的 div，您需要使用 div 类来代替它们的名称。一旦你更新你的 html 以使用类名，对 jQuery 做同样的事情，它应该可以工作

【讨论】：

天啊。如此愚蠢的错误，但我不会想到（我对这些语言还比较陌生。）谢谢！！