jquery treeview 선택된 노드 경로

Question

jquery treeview plugin을 사용하여 디렉토리를 트리 뷰에 나열합니다. 선택한 노드의 경로를 선택해야합니다. 예를 들어 아래 구조를 살펴보십시오.

하면 config.php를 내가이 문제를 해결하기 위해

누군가가 나를 도울 수 사이트/클래스/config.php를 같은 경로를 필요로 다음을 클릭됩니다?

Answer 1

이 데모는 모든 것을 설명하고 신체 섹션에 붙여 넣어야합니다. 페이지에 jQuery가 링크되어 있는지 확인하십시오.

자바 스크립트는 부모 요소를 반복하고 탐색 경로를 구성합니다.

<div id="path">click some element</div> 

<ul> 
    <li><a href="#">SITE</a> 
     <ul> 
      <li><a href="#">classes</a> 
       <ul> 
        <li><a href="#">class.file1.php</a></li> 
        <li><a href="#">class.file2.php</a></li> 
        <li><a href="#">class.file3.php</a></li> 
        <li><a href="#">class.file4.php</a></li> 
        <li><a href="#">class.file5.php</a></li> 
       </ul> 
      </li> 
      <li><a href="#">img</a></li> 
     </ul> 
    </li> 
</ul> 

<style type="text/css"> 
li a { cursor: pointer; text-decoration: none } 
li.active > a { color: red } 
</style> 

<script> 
function getPath(a) { 
    var path = $(a).text(); 
    var $parent = $(a).parents("li").eq(1).find("a:first"); 

    if ($parent.length == 1) { 
     path = getPath($parent) + "/" + path; 
    } 

    return path; 
} 

$(function(){ 
    $("ul a").click(function(){ 
     $("#path").text(getPath(this)); 

     $("li.active").removeClass("active"); 
     $(this).closest("li").addClass("active"); 
     this.preventDefault(); 
    }); 
}); 
</script>