2013-04-23 5 views
0

목록에 동적 클래스를 할당하는 데 문제가 있으므로 작성 중입니다. 아마도 하위 항목을 제대로 실행하지 않았기 때문입니다. 내 코드는 다음과 같습니다목록에 클래스를 동적으로 할당합니다.

<nav id="menu"> 
    <div class="container"> 
     <div class="fourteen columns" style="width: 765px"> 

     <ul> 
      <li class="current"> 
       <a href="#storia" >ABOUT US</a> 
            <ul> 
             <li><a href="#storia">STORIA</a></li> 
             <li ><a href="#team" >TEAM</a></li> 
            </ul> 
      </li> 
      <li> 
       <a href="#fianco">SERVICES</a> 
         <ul> 
          <li><a href="#fianco" >COMPETENZA</a></li> 
          <li><a href="#referenze">REFERENZE</a></li> 

         </ul> 
      </li> 
    </ul> 

그리고 자바 스크립트 : 모든 사람에게

//build dropdown 
$("<select />").appendTo("#menu"); 

// Create default option "Go to..." 
$("<option />", { 
    "selected": "selected", 
    "value" : "", 
    "text" : "Go to..." 
}).appendTo("nav select"); 

// Populate dropdowns with the first menu items 
$("#menu li a").each(function() { 
    var el = $(this); 
    $("<option />", { 
     "value" : el.attr("href"), 
     "text" : el.text() 
    }).appendTo("nav select"); 
}); 

//make responsive dropdown menu actually work   
$("nav select").change(function() { 
    window.location = $(this).find("option:selected").val(); 
}); 

덕분에 저를 도와주세요!

+0

코드가 잘 실행, 문제가 무엇 : 전체 jsfiddle 체크 아웃을? – epascarello

+0

@epascarello 나에게 "회사 소개"를 클릭하면 "서비스"에서 클래스를 할당하고 나중의 속성을 클릭하면 할당되지 않음에 따라 작동하지 않습니다. –

+0

무엇이 문제입니까? 잘 작동합니다. http://jsfiddle.net/6gfpv/ –

답변

0

실제로 요소를 클릭하는 대신 창의 위치를 ​​변경하는 것이 문제입니다. 그래서 어떤 수업도 배정되지 않습니다. 다음에 마지막 부분을 변경 :

$("nav select").change(function() { 
    var link = $(this).val(); 
    if(link != "") //don't do anything for "Go To" 
     $('#menu li a[href=' + link + ']')[0].click(); //simulate click 
}); 

편집 : http://jsfiddle.net/6gfpv/1/

관련 문제