当我点击一个元素时，如何使其他元素崩溃？ jQuery Accordion

我有这个jQuery手风琴工作，以便单击时打开和关闭元素。但是我想知道当你点击另一个（封闭的）元素时如何使一个开放元素关闭。由于我使用了.slideToggle（），所以我无法真正定位激活了.slideDown（）的元素，对吗？因为没有.slideDown（）。当我点击一个元素时，如何使其他元素崩溃？ jQuery Accordion

<div class="accordion"> 
       <div class="a-entry"> 
        <h3 class="a-clickable">Japan</h3> 
        <div class="a-text"> 
         <p> 
          Japan is an island country in East Asia. Located in the Pacific Ocean, it lies to the east of the Sea of Japan, the East China Sea, China, North Korea, South Korea and Russia, stretching from the Sea of Okhotsk in the north to the East China Sea and Taiwan in the south. The kanji that make up Japan's name mean "sun origin", and Japan is often called the "Land of the Rising Sun". 
         </p> 
        </div> 
       </div> 
       <div class="a-entry"> 
        <h3 class="a-clickable">China</h3> 
        <div class="a-text"> 
         <p> 
          China is a sovereign state in East Asia. It is the world's most populous country, with a population of over 1.35 billion. The PRC is a one-party state governed by the Communist Party, with its seat of government in the capital city of Beijing.[15]It exercises jurisdiction over 22 provinces; five autonomous regions; four direct-controlled municipalities (Beijing, Tianjin, Shanghai and Chongqing); two mostly self-governing special administrative regions (Hong Kong and Macau); and claims sovereignty over Taiwan. 
         </p> 
        </div> 
       </div> 
       <div class="a-entry"> 
        <h3 class="a-clickable">South Korea</h3> 
        <div class="a-text"> 
         <p> 
          and commonly referred to as Korea,[9] is a sovereign state in East Asia, constituting the southern part of the Korean Peninsula.[10] The name Korea is derived from the ancient Kingdom of Goguryeo, also known as Koryŏ. Highly urbanized at 92%,[11] Koreans lead a distinctive urban lifestyle with half of them living in the Seoul Capital Area, the world's second largest city[12] with over 25 million residents[13] and a leading global city[14] with the fourth largest economy,[15] rated in 2016 as the world's most livable megacity and safest city to live in.[16] Highly mountainous, Korea is a popular winter sport destination in Asia, hosting the 2018 Winter Olympics. 
         </p> 
        </div> 
       </div> 

.accordion { 
    width: 50%; 
    background-color: #ffffff; 
    padding: 0; 
    margin: 0; 
} 

.a-clickable { 
    background-color: #999; 
    padding: 8px; 
    border: 3px solid #777; 
    margin: 0; 
    cursor: pointer; 
} 

.a-clickable:hover { 

} 

.a-text { 
    display: none; 
    padding: 8px; 
    padding-top: 0; 
    margin: 0; 
} 

$('.a-clickable').on('click', function() { 
    $(this).siblings().slideToggle(300); 
});

以下是当前的版本。

https://jsfiddle.net/x8v4cvca/

来源

2016-02-10 Matt Lee

你拨动点击的元素之前瞄准所有可点击对象，并hide他们（在这种情况下，slideUp()。

$('.a-clickable').on('click', function() { 
    $('.a-clickable').not(this).siblings().slideUp(200); 
    $(this).siblings().slideToggle(200); 
});

来源

2016-02-10 21:18:21 Draco18s

谢谢！这帮了很多。我学到很多东西。 –

如果你确定使用jQuery UI的，它开箱即用，请参阅演示here。当您单击标题时，它将关闭当前打开的标题。

来源

2016-02-10 21:19:03

感谢您的回复，但这是一个学校作业，所以我正在寻找手写代码。我可以学习和学习的东西。不过谢谢。 –

您可以将ID或类添加到刚刚切换的元素nd通过使用该类访问已经切换的元素。然后再次从元素中删除类。

来源

2016-02-10 21:20:43

当我点击一个元素时，如何使其他元素崩溃？ jQuery Accordion

回答

相关问题