2014-09-23 3 views
0

Я пытаюсь скрыть/показать несортированные списки с помощью onClick-Event.Javascript - скрыть/показать - несортированные списки - onClick

В верхней три различных варианта выбора:

<ul id="homepage-posts-block" class="tabs-search quicktabs-tabs quicktabs-style-nostyle"> 
    <li class="grid-feat-ad-style active" onclick="zeigeFilter(catF, typF, locF)"><a class="current" href="#"></i><?php _e('Categories', 'agrg'); ?></a></li> 
    <li class="list-feat-ad-style" onclick="zeigeFilter(locF, typF, catF)" ><a class="" href="#"></i><?php _e('Types', 'agrg'); ?></a></li> 
    <li class="list-feat-ad-style" onclick="zeigeFilter(typF, catF, locF)" ><a class="" href="#"></i><?php _e('Locations', 'agrg'); ?></a></li> 
</ul> 

После выбора одного, функция «zeigeFilter» называется:

<script> 
function zeigeFilter(var id1,var id2,var id3) { 
    document.getElementById(id1).style.visibility = 'show'; 
    document.getElementById(id2).style.visibility = 'hidden'; 
    document.getElementById(id3).style.visibility = 'hidden'; 
} 
</script> 

В зависимости от того, какой вариант выбран конкретный раковина отображается.

<ul class="filters-lists" id="catF"> 
    <li>..</li> 
</ul> 
<ul class="filters-lists" id="typF"> 
    <li>..</li> 
</ul> 
<ul class="filters-lists" id="locF"> 
    <li>..</li> 
</ul> 

Моя проблема заключается в том, что все три списка отображаются в любое время. Я надеюсь, что кто-то может мне помочь.

Спасибо, Joh

ответ

0

Здесь приходит решение:

  • это не 'шоу', но 'видимым' для свойства видимости (CSS)
  • неправильно paramters для вызова " метод zeigeFilter»

правильный код:

<script type="text/javascript"> 
function zeigeFilter(id1, id2, id3) { 
    document.getElementById(id1).style.visibility = 'visible'; 
    document.getElementById(id2).style.visibility = 'hidden'; 
    document.getElementById(id3).style.visibility = 'hidden'; 
} 
</script> 

<ul id="homepage-posts-block" class="tabs-search quicktabs-tabs quicktabs-style-nostyle"> 
    <li class="grid-feat-ad-style active" onclick="zeigeFilter('catF', 'typF', 'locF')"><a class="current" href="#"></i>premier</a></li> 
    <li class="list-feat-ad-style" onclick="zeigeFilter('typF', 'catF', 'locF')"><a class="" href="#"></i>deuxieme</a></li> 
    <li class="list-feat-ad-style" onclick="zeigeFilter('locF', 'typF', 'catF')" ><a class="" href="#"></i>troiseme</a></li> 
</ul> 

<ul class="filters-lists" id="catF"> 
    <li>..</li> 
</ul> 
<ul class="filters-lists" id="typF"> 
    <li>..</li> 
</ul> 
<ul class="filters-lists" id="locF"> 
    <li>..</li> 
</ul> 
Смежные вопросы