클래스를 추가/제거하고 jQuery를 사용하여 정렬되지 않은 목록 탐색에 추가

Question

정렬 된 정렬되지 않은 목록이 수평 탐색 막대로 표시됩니다. 마지막 목록 항목에는 아래와 같이 끌어 오기 권한 클래스가있는 검색 상자가 있습니다. ..

<div class="navbar"> 
    <ul> 
     <li><a href="#">Coming Up</a></li> 
     <li><a href="#">This Month</a></li> 
     <li><a href="#">Next Month</a></li> 
     <li><a href="#">All Events</a></li> 
     <li><a href="#">Past Events</a></li> 
     <li><a href="#">Contact Us</a></li> 
     <li class="pull-right"> 
    <div id="event-serach-content"> 
    <form id="search-event" method="get" action=""> 
    <div class="event-search-box"> 
    <input type="text" placeholder="Search events..." id="frm-search" name="s"> 
      </div> 
    <div class="event-submit-btn"> 
      <button type="submit">Go</button> 
    </div> 
    </form> 
    </div> 

    </li> 
    </ul> 

    </div> 
<!-- navbar End //--> 

I/추가 클릭 이벤트와 '선택'클래스를 제거하고 범위 태그를 추가 다음과 같은 jQuery를 가지고있다. 마지막 목록을 무시하는 방법, 즉 선택한 클래스를 추가하지 않을 수 있습니까? 빈 span 태그의 Bg는 아래쪽 화살표입니다. 이것이 의미가 있기를 바랍니다. 미리 감사드립니다. 당신은 단지이 경우 마지막 자식을 확인하기 위해 클릭 기능에 조건을 추가 할 필요가

$(".navbar ul li:not(:last)") 

Answer 1

당신은 :not 및 :last 선택기를 사용할 수 있습니다.

$('.navbar ul li').click(function(e) { 
    // If LI is not last child append class 
    if (! $(this).is(':last-child')) { 
     $(".navbar ul li").removeClass('selected').find('span').empty().remove(); 
    } 

    // Rest of code for click 
}); 

Answer 2

:

  $(document).ready(function() { 

      $(".navbar ul li:first").addClass('selected').append('<span></span>'); 

       $(".navbar ul li").click(function(){ 
        $(".navbar ul li").removeClass('selected').find('span').empty().remove(); 

        $(this).addClass('selected'); 
        if ($(this).hasClass('selected')) { 
         // $(".navbar ul li:last").removeClass('selected').find('span').empty().remove(); 
          $(".navbar ul li").append('<span></span>') 
        } 
        return false 
       }); 

      }); 

Answer 3

왜, 당신이 (가) 태그를 사용하지 않는 클릭 이벤트에 대한 ""태그를 대상으로하지 당신이 :not(:last)

  $(".navbar ul li:not(:last)").click(function(){ 
       $(".navbar ul li").removeClass('selected').find('span').empty().remove(); 

       $(this).addClass('selected'); 
       if ($(this).hasClass('selected')) { 
        // $(".navbar ul li:last").removeClass('selected').find('span').empty().remove(); 
         $(".navbar ul li").append('<span></span>') 
       } 
       return false 
      });