부트 스트랩 트리보기가 작동하지 않습니까?

부트 스트랩 트리보기를 사용하려고합니다. 문서에 따라 코드를 작성했지만 브라우저에서 열 때 아무 것도 나타나지 않습니다. 뭐가 잘못 되었 니?부트 스트랩 트리보기가 작동하지 않습니까?

나는 zip 소스 코드에서 bootstrap.min.css과 bootstrap.min.js을 추출하여 treeview에 넣었다.

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

<!-- jQuery library --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

<!-- Latest compiled JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 

<!-- Treeview --> 
<script src="/treeview/bootstrap-treeview.min.css"></script> 

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
</head> 
<body> 
hello 
<div class="container"> 
    <div id="tree"></div> 
</div> 
</body> 
<script> 
    var mytree = [ 
     { 
      text: "Parent 1", 
      nodes: [ 
       { 
        text: "Child 1", 
        nodes: [ 
         { 
          text: "Grandchild 1" 
         }, 
         { 
          text: "Grandchild 2" 
         } 
        ] 
       }, 
       { 
        text: "Child 2" 
       } 
      ] 
     }, 
     { 
      text: "Parent 2" 
     } 
    ]; 

    $('#tree').treeview({data: mytree}); 
</script> 
<!-- Font --> 
<script src="https://use.fontawesome.com/c1d4b38cd6.js"></script> 

<!-- JQuery --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

<!-- UI --> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

<!-- Treeview --> 
<script src="/treeview/bootstrap-treeview.min.js"></script>

출처

2017-09-08 Jennifer Tao

당신이 모든 수입을 이동 봤어에 대한 예를 썼다 맨 위로? 콘솔에 오류가 있습니까? –

$ ('# tree'). treeview ({data : mytree}); 이후 모든 스크립트가로드 된 후에 만 호출하십시오. – Fetrarij

당신은 부트 스트랩-treeview.min.js 포함 후에 올 초기화하여 트 리뷰를 이동하고 내부를 유지해야한다 : 그래서 그것은해야

$(function(){ 
    // This code runs after the document ready. 
});

. 
. 
. 
<!-- Treeview --> 
<script src="/treeview/bootstrap-treeview.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     var mytree = [ 
      { 
       text: "Parent 1", 
       nodes: [ 
        { 
         text: "Child 1", 
         nodes: [ 
          { 
           text: "Grandchild 1" 
          }, 
          { 
           text: "Grandchild 2" 
          } 
         ] 
        }, 
        { 
         text: "Child 2" 
        } 
       ] 
      }, 
      { 
       text: "Parent 2" 
      } 
     ]; 

     $('#tree').treeview({data: mytree}); 
    }); 
</script>

이것은 작동하는 버전입니다. https://jsfiddle.net/jc788d2L/

출처

2017-09-08 02:48:58

머리 속에 링크를 넣으십시오.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<script src="/treeview/bootstrap-treeview.min.css"></script>

다음으로 트 리뷰 init을 :

$(function(){ 
    $('#tree').treeview({data: mytree});  
})

난 그냥 당신 https://jsbin.com/murerucodo/edit?html,output

당신은 체크 아웃 할 수있다 :

출처

2017-09-08 03:04:05 AirNoir

부트 스트랩 트리보기가 작동하지 않습니까?

답변

관련 문제