li 객체에서 특정 div를 표시하는 방법은 무엇입니까?

Question

을 <li> 개 생성하여 UL을 슬라이드하고 특정 div를 표시하려고합니다.

<div id="1"></div> 
<div id="2"></div> 
<div id="3"></div> 

그리고이 목록 :

<ul class="meny"> 
    <li id="show1">Show 1</li> 
    <li id="show2">Show 2</li> 
    <li id="show3">Show 3</li> 
</ul> 

왜이 작동 JS하지 않습니다 나는이 사업부 - 태그가?

$(function() { 
    $("#show1").click(function() { 
     $(".meny").toggle("slide"); 
     $("#1").click("show"); 
    }); 
}); 

나는 EDIT

... 밤새

난 당신이 특정 목록을 누를 때 클릭 이벤트가 발생하도록 내 프로젝트를 얻으려고 시도했습니다 목적. 그 일이 끝나면 전체 ul이 사라져서 지정된 div가 표시되어야합니다.

은 참조 : http://aatw.se/test/booking.html

Answer 1

, 당신이 쇼의 함수를 호출 할 필요가 너무 - 작동합니다. div가 비어있는 것은 문제가되지 않습니다. 그러나 당신은 페이지를로드 할 때 그들을 숨기거나 CSS에 아무 것도 표시하지 않도록 설정해야합니다.여기 http://jsfiddle.net/D6qUe/2

당신이 무엇을 원하는 업데이트 된 코드

div{width:100px;height:100px;background-color:#afa;border:1px solid #0f0;display:none;} 

Answer 2

$("#1").click("show");

가 있어야한다 :

이

$("#1").show(); 

Answer 3

첫째로 당신의 div's가 비어 있습니다.

다음

$("#1").click("show"); 

이 HTML-5의 데이터를 사용하여

$("#1").show(); 

당신은 모든 li's에 하나의 이벤트 핸들러를 쓸 수 있어야

HTML 속성

(210)

<div id="1">This is Div 1</div> 
<div id="2">This is Div 2</div> 
<div id="3">This is Div 3</div> 

<ul class="meny"> 
    <li data-id="1">Show 1</li> 
    <li data-id="2">Show 2</li> 
    <li data-id="3">Show 3</li> 
</ul> 

JS는

$(function() { 
    $("li").click(function() { 
     $(".meny").toggle("slide"); 
     $("#" + $(this).data('id')).show(); 
    }); 
}); 

Check Fiddle

Answer 4

이 언급 한 바와 같이

$("#1").css("display","block");