2013-10-05 3 views
0

드롭 다운/선택 상자 안에 treemenu를 포함 할 수있는 방법이 있습니까? 난 내가 트리 메뉴와 같은 목록 내 카테고리를 원하는드롭 다운/선택 상자 내의 메뉴 트리

<ul id="example"> 
<li>Category1 
    <ul> 
     <li><a href="http://www.autisticcuckoo.net">Category1 subcat1</a></li> 
     <li><a href="http://www.zeldman.com">Category1 subcat2</a></li> 
     <li><a href="http://www.meyerweb.com">Category1 subcat3</a></li> 
    </ul> 
</li> 
<li>Other Sites 
    <ul> 
     <li><a href="http://www.accessify.com/">Category2</a></li> 
     <li><a href="http://www.w3.org/">Category3</a> 
      <ul> 
       <li><a href="http://validator.w3.org/">Category3 subcat1</a></li> 
       <li><a href="http://jigsaw.w3.org/css-validator/">Category3 subcat2</a></li> 
       <li><a href="http://www.w3.org/TR/WAI-WEBCONTENT/">Category3 subcat3</a></li> 
      </ul> 
     </li> 
    </ul> 
</li> 

같은 카테고리의 목록을 가지고있다. http://mackpexton.com/projects/TreeMenu/index.htm 이제 jquery를 사용하여 선택 상자를 표시합니다. 이 일을 할 수있는 방법이 있습니까?

+0

http://stackoverflow.com/questions/5288792/how-to-indent-multiple-levels-of-select-optgroup-with-css – Mina

답변

1

선택 상자 안에서 할 수 없습니다. 당신은 그것을 가짜로 만들 수 있습니다. 선택 상자와 클릭하여 컨테이너를 생성하고 ul 목록과 버튼을 클릭하면 표시됩니다. 그런 다음 목록에서 항목을 클릭 한 후 클릭 한 항목을 선택 상자의 특정 항목에 매핑하고 드롭 다운을 트리거하는 보이는 버튼의 값을 업데이트해야합니다.

+0

선택 박스 드롭 다운을 고뇌에 대한 이벤트가 없습니다 당신이 할 수 있도록 이러지마. –

0

당신은 복잡한 일을합니다. 왜 누구는 선택 목록에 계층 적 메뉴를 포함하려고합니다. 선택 목록은 항목 목록을 표시하기위한 것입니다. 트리 메뉴에서 선택한 항목을 어떻게 알 수 있습니까? (내가 선택한 항목 경로를 어떻게 알 수 있는지).

사이트 (예제)를 사이트에 게시 할 수 있다면 도움이 될 것입니다.

내가 .. 이미지를 업로드 이것이 당신이이 나무 메뉴라고합니다 것입니다

enter image description here

달성하려고하는 것입니다.

enter image description here

번째 이미지 JQuery와 선택한 사이트이다. 이것이 당신이 원하는 것일 경우

쉽게 얻을 수 있습니다.

<select> 
     <optgroup label="fruits"> 
      <option>Apple</option> 
      <option>Apple</option> 
      <option>Apple</option> 
     </optgroup> 
     <optgroup label="fruits"> 
      <option>Apple</option> 
      <option>Apple</option> 
      <option>Apple</option> 
     </optgroup> 
     <optgroup label="fruits"> 
      <option>Apple</option> 
      <option>Apple</option> 
      <option>Apple</option> 
     </optgroup> 
    </select> 
+0

jquery가 선택한 작품과 같은 것을 원합니다. 드롭 다운의 다른보기를 제공합니다. 하지만 표시 할 카테고리와 하위 카테고리 수가 더 많습니다. 따라서 드롭 다운을 스크롤하는 것은 매우 어렵습니다. Thats y 트리 메뉴 유형 디스플레이가 있는지 확인합니다. –

+0

이미지를 업로드했습니다. 이제 이것이 트리 메뉴라고 불리는 것입니다. –

+0

두 번째 이미지는 jquery가 선택한 사이트에서 가져온 것입니다. –