Как я могу отобразить конкретную запись с помощью JQuery? - PullRequest
Новая
       3

Как я могу отобразить конкретную запись с помощью JQuery?

0 голосов
/ 14 марта 2012

Все 

<ul class="icontacts">
    <li id="a" class="item" style="display: block; "><a name="a" class="title">A</a>
        <ul>
            <li>
                <a class="my all">ajay</a>
                <a class="my all">anand</a>
                <a class="ex all">amy</a>
            </li>
        </ul>
     </li>
     <li id="c" class="item pmy" style="display: block; "><a name="c" class="title">C</a>
         <ul>
          <li>
              <a class="my all">Chim</a>
              <a class="my all">Ciny</a>
              <a class="ex all">Commy</a>
          </li>
         </ul>
     </li>
     <li id="d" class="item pmy" style="display: block; "><a name="d" class="title">D</a>
        <ul>
            <li><a class="my all">don</a></li>
         </ul>
     </li>
</ul>

В приведенном выше коде у меня есть список записей, закороченных в алфавитном порядке.Теперь у меня есть два типа записи, одна из которых «моя», а другая «ex»

У меня есть две кнопки, если я нажму на «Моя запись», будет отображаться только «моя» запись класса с буквенным обозначением li * 1006.* 

<li id="a" class="item pmy" style="display: block; "><a name="c" class="title">C</a>

то же самое для кнопки класса "ex" для другой записи.

Я делаю это, но не получается, если один li с классом "item" имеет 2 разных ("my" и ""ex ") запись. 

<script>
    $(document).ready(function () {
      $(".pall").css("display","none");
    });

    $(".all_click").click(function(){
       $(".all").css("display","block"); 
    });

    $(".my_click").click(function(){
       $(".all").css("display","none");
       $(".my").css("display","block"); 
    });

    $(".ex_click").click(function(){
       //ec click function

       $(".my").css("display","none"); 
       $(".ex").css("display","block"); 

    });
</script>

Результат, который я хочу, равен

Для всех случаев: 

A
ajay
anand
amy
B
Chim
Ciny
Commy
D
don

Для случаев мой 

A
ajay
anand
B
Chim
Ciny
D
don

Для случая ex 

A
amy
B
Commy

В этом случае li с классом элементов также не будет отображаться.

1 Ответ

1 голос
/ 14 марта 2012
  1. Поместите все в функцию готовности
  2. Используйте hide() и show()

Код: 

$(document).ready(function() {
    $(".pall").hide();

    $(".all_click").click(function() {
        $(".all").show();
    });

    $(".my_click").click(function() {
        $(".all").hide();
        $(".my").show();
    });

    $(".ex_click").click(function() {
        //ec click function
        $(".my").hide();
        $(".ex").show();

    });
});​
...