2010-12-31 8 views
1

내가 읽은 문서JQuery와 트 리뷰는 항목

도 봤

http://docs.jquery.com/Plugins/Treeview/treeview#options

선택,하지만 아무것도 방법을 선택한 항목을 강조으로, 쉽고 좋은 해결책을 찾을 수 없습니다 하이라이팅. 범위를 사용하므로 리디렉션되지 않지만 선택되지 않음

+0

선택한 항목이 무엇을 의미합니까? 마지막으로 클릭 한 항목은 무엇입니까? 개인적으로 jstree는 크고 광범위한 API 구조를 가지고 있으므로 jQuery 플러그인을 jQuery 플러그인으로 사용하는 것이 좋습니다. – Raynos

답변

1

'이'핸들러 함수 내부

$('#browser li.file').bind('click', function() { 
    //clear all clicked items if any 
    $('.clicked').removeClass('clicked'); 
    //set this clicked 
    $(this).addClass('clicked'); 
}) 

단어가 클릭 된 항목을 가리 킵니다. 다른 것을 의미하는 '선택'을 사용하면 예와 같이 원하는 이벤트 유형을들을 수 있습니다.

$('#browser li.file').bind('mouseover', function() { 
... your code ... 
}) 
1

트리보기에서 추가 된 분기에 ID 태그를 추가합니다.

"<li><span id="myNode1" class='file'>Item2</span></li>" 

그런 다음 jQuery 하이라이트를 사용하여 선택한 노드를 강조 표시 할 수 있습니다.

$("#myNode1").click(function() { 
     $(this).effect("highlight", {}, 3000); 
}); 

또는 영구적으로 스타일

$('#myNode1').css('styleFloat'); 
을 변경하려면 트리에서 리 항목을 선택하고 다음과 같이 그들에게 이벤트 리스너를 추가 할 수 있습니다
2

이 코드는 트 리뷰에서 파일을 강조하기위한 작동합니다

$(document).ready(function(){ 
     $("#index").treeview(); 
      $('#index span.file').bind('click', function() { 
       //clear all clicked items if any 
       $('.selected').removeClass('selected'); 
       //set this clicked 
       $(this).addClass('selected'); 
      }); 
     }); 

jquery.treeview.css에서 :

.treeview span.file.selected { background-color: #F0FFF0; } 
0

그것은 날짜가있을 수 있습니다하지만 난을 추가하여 과거 얻었다 jqueryFileTree.js의 FileTree 함수 (버전 2.14) 아래에서 다음과 같습니다.

function FileTree(el, args, callback) { 
    ... 
    $el.delegate("li a", this.options.folderEvent, _this.onEvent); 
    $el.delegate("li a", "click", function(event){ 
    $("#" + $el[0].id + " li a.selected").removeClass("selected"); 
    $(this).addClass("selected"); 
    }); 
}