Question

我正在尝试对具有相同标签的所有ID应用隐藏效果，但它仅适用于第一个。当我尝试添加slideToggle时遇到同样的问题，但是解决这个问题会解决其他问题。

JQUERY

   var allPanels = $('#accordionSlide');

   allPanels.hide();

CSS

   #accordion { 
                display: block;
                width: 100%;
                overflow: hidden;
              }
   #accordionBtn { display: block; }

   #accordionSlide { display: block;}

HTML

                <div id="accordion"> 

                    <div id="accordionBtn">
                        <a href="#">Solutions</a>
                    </div>

                    <div id="accordionSlide">
                        <a href="/solutions/wireless-remote-monitoring/index.html">Wireless Remote Monitoring</a>
                    </div>

                    <div id="accordionBtn">
                         <a href="#">Solutions</a>
                     </div>

                    <div id="accordionSlide">
                        <a href="/solutions/wireless-remote-monitoring/index.html">Wireless Remote Monitoring</a>
                    </div> 

                </div>

Answer 1

使用类属性，因为 id 对于每个元素都应该是唯一的。 id仅代表一个元素，这就是它应该是唯一的原因。因此，当您应用选择器时，它只选择它在页面上找到的第一个元素。

这样做：

 <div class="accordionSlide">
                        <a href="/solutions/wireless-remote-monitoring/index.html">Wireless Remote Monitoring</a>
                    </div>

和jquery：

 var allPanels = $('.accordionSlide');

   allPanels.hide();

Answer 2

ID Selector (“#id”)-->Selects a single element with the given id attribute.

如果您想申请所有元素，请使用class代替id

var allPanels = $('.accordionSlide');

allPanels.hide();

HTML

<div class="accordionSlide"></div>

Answer 3

jQuery在查询ID时只匹配一个元素。 $（＆＃34;＃foo＆＃34;）。get（）将返回最多一个Element对象的数组。有关更多信息，请参阅jQuery文档。

Jquery效果仅适用于第一个id

3 个答案: