>  기사  >  Java  >  zTree 트리 플러그인 사용 - 비동기 로딩 방법 소개

zTree 트리 플러그인 사용 - 비동기 로딩 방법 소개

零下一度
零下一度원래의
2017-06-26 14:45:432032검색
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>异步加载</title>
<link rel="stylesheet"href="${pageContext.request.contextPath}/zTree_v3-master/css/demo.css?1.1.11">
<link rel="stylesheet"href="${pageContext.request.contextPath}/zTree_v3-master/css/zTreeStyle/zTreeStyle.css?1.1.11">
<script type="text/javascript"src="${pageContext.request.contextPath}/jquery-2.1.1.min.js?1.1.11"></script>
<script type="text/javascript"src="${pageContext.request.contextPath}/zTree_v3-master/js/jquery.ztree.core.min.js?1.1.11"></script>
<script type="text/javascript">var setting = {
        async : {
            enable : true,
            url : "${pageContext.request.contextPath}/ztreeAction!getMenusById.jhtml",
            autoParam : [ "id" ],//dataFilter : filter        },
        data : {
            key : {
                url : "xUrl"},
            simpleData : {
                enable : true,
                pIdKey : "pid"}
        },

    };
    $(document).ready(function() {
        $.fn.zTree.init($("#treeDemo"), setting);
    });</script>



</head>
<body>
    <div class="ztree"style="width: 20%; height: 500px; padding-top: 10px; float: left; border: 1px solid #FF0000;">
        <ul id="treeDemo"></ul>
    </div>

</body>
</html>

위 코드는 순수 플러그인 테스트이기 때문에 기존에 사용했던 코드를 그대로 복사하면 됩니다. 작성할 필요는 없으며 단지 쿼리일 뿐입니다. 아래에 ztree의 테이블 필드를 첨부합니다.

이것이 모두에게 도움이 되기를 바랍니다. ztree 플러그인을 다시 배울 때의 테스트 코드입니다. , 다른 프레임워크에서는 시도하지 않은 ssh 프레임워크 주석 버전입니다. 그러나 일단 사용 방법을 이해하고 나면 여러분 모두가 나보다 훨씬 낫다고 믿습니다. 마스터가 아니라 공유만 하면 됩니다. 맙소사 뿜지마세요~~~~~~~~~~

위 내용은 zTree 트리 플러그인 사용 - 비동기 로딩 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.