Question

这是我的HTML：

                <div class="content-box" id="enabled_add"> 
                <h2 class="title">hallo</h2>
                <div class="content-box-heading-orange"></div> 
                <div class="content-box-content">
                Hallo
                </div> 
            </div>              
            <div class="content-box" id="enabled_add"> 
                <h2 class="title">hallo2</h2>
                <div class="content-box-heading-orange"></div> 
                <div class="content-box-content">
                Hallo2
                </div> 
            </div>

这是我的JS

$('#usernav_close').click(function(){
            setTimeout(function(){
                $('#enabled_add').fadeOut('slow');
            });
        });

我希望将所有ID为enabled_add的内容框添加到FadeOut中。但我的问题是只选择了第一个元素。

Answer 1

id必须是唯一的。如果您尝试重用id，则只有第一个将由jQuery找到/更新。你想在这里使用一个类。

<div class="content-box enabled_add"> 
  <h2 class="title">hallo</h2>
  <div class="content-box-heading-orange"></div> 
  <div class="content-box-content">
    Hallo
  </div> 
</div>              
<div class="content-box enabled_add"> 
  <h2 class="title">hallo2</h2>
  <div class="content-box-heading-orange"></div> 
  <div class="content-box-content">
    Hallo2
  </div> 
</div>

$('#usernav_close').click(function(){
  setTimeout(function(){
    $('.enabled_add').fadeOut('slow');
  });
});

Answer 2

id属性应该对页面上的元素是唯一的。您不应该在一个文档中两次使用相同的ID。

The difference between ids and classes

但是，您可以为一个元素提供多个类。

<div class="content-box enabled_add">

这意味着您的选择器会读取

$('.enabled_add')

FadeOut具有相同名称的所有id

2 个答案: