2010-01-11 2 views
1

jquery 트리 뷰를 사용하고자합니다. 아이템에 대해 선택할 카테고리와 하위 카테고리가 있으며이를 트리보기에 표시하고 싶습니다. 나는 그 때 클릭 한 가치를 얻고 싶다.Jquery 트리 뷰에서 클릭 된 요소를 검색하는 방법

나는 종류의 뭔가 작업을하고있는 순간

:

<ul id="treeview"> 
    <li>group1a 
     <ul> 
      <li>group11 </li> 
     </ul> 
    </li> 
    <li>group2 </li> 
    <li>group3 </li> 
    <li>group4 </li> 
    <li>group5 </li> 
</ul> 

나는이 스크립트를 시도했지만 클릭 기능이 나에게 오류가 발생.

<script type="text/javascript"> 
      $().ready(function() { 
       $("#treeview").treeview(); 
      }); 

      $("#treeview").click(function (e) { 
       e.target.addClass("selected"); 
      }); 

</script> 

addClass는 jQuery를 방법입니다 ..

답변

2

을 나는 일을 처리하는이 JQuery와 방법에 매우 큰 초보자입니다, 그래서 ... 나는 어딘가에 몇 가지 중요한 점을 놓치고 당신의 도움에 대한 감사를 가정 e.target은 jQuery 객체가 아닙니다. 해당 요소의 화재는, e.target 항상 #treeview 요소가 될 때 클릭 이벤트가 #treeview 요소에만 바인딩으로,

$("#treeview").click(function (e) { 
    $(e.target).addClass("selected"); 
}); 

귀하의 코드는 어쨌든 작동하지 않습니다, 그리고 : 당신은 $()로 묶어야합니다. 당신이 찾고있는 것은 아마이 같은 것입니다 :

$("#treeview li").click(function() { 
    $(this).addClass("selected"); 
}); 

이 모든 li 요소에 클릭 기능을 결합, 그 중 하나를 클릭 할 때, 그 요소에 "선택"클래스를 추가합니다.

아마 개체 선택을 취소 할 수 있으므로 addClass 대신 toggleClass을 사용해야합니다. 하나의 개체 만 선택할 수있게하려면 다음을 사용하십시오.

$("#treeview li").click(function() { 
    // Clear all selected states 
    $('#treeview li').removeClass('selected'); 
    // Set current as selected 
    $(this).addClass("selected"); 
}); 

희망이 있습니다.

+1

정확히 대답하는 중간에 있었지만 Tatu가 먼저했습니다. – fserb

0

시도 :

$(document).ready(function(){ 
    $("#browser").treeview({ 
     toggle:function(){ 
      console.log($(this).find('ul li')); 
     } 
    }); 

토글 클릭에 대한 콜백입니다. 'this'값은 트리 내용이있는 'ul'을 포함하는 'li'을 나타냅니다. 이 경우 콘솔은 모든 'li'이 'ul'내부에 중첩 된 것을 찾습니다.

관련 문제