văn bản lá gói trong jstree

Question

Tôi đang sử dụng plugin jstree để điền vào cây của tôi dựa trên tệp xml. Một số nút văn bản lớn hơn div vùng chứa. Có cách nào để văn bản gói văn bản nút jstree?

$(document).ready(function(){ 
    $("#tree").jstree({ 
     "xml_data" : { 

      "ajax" : { 

       "url" : "jstree.xml" 

      }, 

      "xsl" : "nest" 


     }, 
     "themes" : { 

      "theme" : "classic", 

      "dots" : true, 

      "icons" : true 

     }, 

     "search" : { 

       "case_insensitive" : true, 

       "ajax" : { 

        "url" : "jstree.xml" 

       } 

      }, 
       "plugins" : ["themes", "xml_data", "ui","types", "search"] 


    }).bind("select_node.jstree", function (event, data) { 

     $("#tree").jstree("toggle_node", data.rslt.obj); 

Answer 1

Hãy thử thêm các phong cách sau vào neo con của jsTree div của bạn:

#jstree_div_id a { 
    white-space: normal !important; 
    height: auto; 
    padding: 1px 2px; 
} 

Tôi cũng có một max-width trên jsTree tôi div styling:

#jstree_div_id 
{ 
    max-width: 200px; 
} 

Answer 2

#tree_id { 
    .jstree-anchor { 
    white-space: normal; 
    height: auto; 
    } 
    .jstree-default .jstree-anchor { 
    height: auto; 
    } 
} 

Answer 3

Làm việc này cho 3.0.8

.jstree-anchor { 
    /*enable wrapping*/ 
    white-space : normal !important; 
    /*ensure lower nodes move down*/ 
    height : auto !important; 
    /*offset icon width*/ 
    padding-right : 24px; 
} 

Và đối với những người sử dụng plugin wholerow;

//make sure the highlight is the same height as the node text 
$('#tree').bind('hover_node.jstree', function() { 
    var bar = $(this).find('.jstree-wholerow-hovered'); 
    bar.css('height', 
     bar.parent().children('a.jstree-anchor').height() + 'px'); 
}); 

Answer 4

Tôi tìm thấy câu trả lời bằng coincedence và nó làm việc cho tôi, nhưng, tôi đã có một quy tắc css đã được ngăn chặn mã từ hoạt động tốt

tôi loại bỏ các quy tắc css (min-height: 200px) "trong mã của tôi" và câu trả lời sau đây làm việc cho tôi như tôi mong đợi.

#tree_div_id a { 
white-space: normal; 
height: auto; 
padding: 0.5ex 1ex; 
margint-top:1ex; 
}