隱藏並顯示列表中的元素

Question

在屏幕加載時，我需要隱藏列表中除li＃active_language之外的所有元素。

第二步是單擊可見的li＃active_language元素，該元素應打開所有其他li元素。 我嘗試使用下面的代碼，但無法正常工作。

希望有人能幫忙。 謝謝

$(document).ready(function(){
$( ".jflanguageselection li:not(#active_language)").hide();
$( "#active_language" ).click(function() {
$( ".jflanguageselection li:not(#active_language)").css("display","block";).show(10000);
});
});

這是HTML代碼：

<ul class="jflanguageselection">
<li><a href="#"><img src="#" alt="English" title="English"></a></li>
<li id="active_language"><a href="#"><img src="#" alt="Deutsch" title="Deutsch"></a></li>
<li><a href="#"><img src="#" alt="Swedish" title="Swedish"></a></li>
<li><a href="#"><img src="#" alt="Serbian" title="Serbian"></a></li>
</ul>

Answer 1

在您的網站上，解決方案是：

 $(function () { $('#jflanguageselection ul.jflanguageselection li:not("#active_language")').hide(); $('#active_language').on('click', function(e) { e.preventDefault(); $('#jflanguageselection ul.jflanguageselection li:not("#active_language")').toggle(1000); }); }); 

 <script src="https://code.jquery.com/jquery-1.12.1.min.js"></script> <div id="jflanguageselection"> <ul class="jflanguageselection"> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/en/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/en.gif" alt="English" title="English"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/sr/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/sr.gif" alt="Mne/Sr" title="Mne/Sr"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/ru.gif" alt="Russian" title="Russian"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/pl/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/pl.gif" alt="Polish" title="Polish"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/ro/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/ro.gif" alt="Romanian" title="Romanian"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/cz/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/cz.gif" alt="Czech" title="Czech"></a></li> <li id="active_language"><a href="http://www.crna-gora-apartmani.com/de/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/de.gif" alt="Deutsch" title="Deutsch"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/it/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/it.gif" alt="Italian" title="Italian"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/fr/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/fr.gif" alt="Francais" title="Francais"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/se/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/se.gif" alt="Swedish" title="Swedish"></a></li> <li style="display: none;"><a href="http://www.crna-gora-apartmani.com/hu/"><img src="http://www.crna-gora-apartmani.com/components/com_joomfish/images/flags/hu.gif" alt="Magyar" title="Magyar"></a></li> </ul> </div>