Jquery效果只作用于第一个id

Jquery effect works on only the first id

本文关键字：第一个 id 作用于 Jquery      更新时间：2023-09-26

我试图在所有ID的相同标签上应用隐藏效果，但它只适用于第一个。当我试图添加slideToggle时，我也遇到了同样的问题，但我认为解决这个问题将解决其他问题。

JQUERY

   var allPanels = $('#accordionSlide');
   allPanels.hide();
CSS

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


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

使用class属性作为id对于每个元素应该是唯一的。Id只表示一个元素，这就是为什么它应该是唯一的。所以当你应用选择器时，它只选择它在页面上找到的第一个元素。

这样做:

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

和jquery: 

 var allPanels = $('.accordionSlide');
   allPanels.hide();

jQuery在查询ID时只匹配一个元素。$("#foo").get()将返回至多包含一个Element对象的数组。

ID Selector (" # ID ")-->选择具有给定ID属性的单个元素。

如果您想应用到所有元素，则使用class代替id 

var allPanels = $('.accordionSlide');
allPanels.hide();
html

<div class="accordionSlide"></div>
相关文章：