sooka_maintenance
/
spqzqd_siping


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
							<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../../lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
    <link href="../../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
    <script src="../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
    <script src="../../lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>
    <script type="text/javascript">
        var manager = null;
        $(function ()
        {
            manager = $(".l-tree").ligerTree({ checkbox: true });

        });
        function reload()
        {
            manager.clear();
            manager.loadData(null, 'tree.json');
        }

        function addTreeItem()
        {
            var node = manager.getSelected();
            var nodes = [];
            nodes.push({ text: $("#txtNode").val() });
            if (node)
                manager.append(node.target, nodes); 
            else
                manager.append(null, nodes);
        }
        function addTreeItem2()
        {
            var node = manager.getSelected();
            var nodes = [];
            nodes.push({ text: $("#txtNode").val(), children: [{ text: '111', children: [{ text: '222'}]}] });
            if (node)
                manager.append(node.target, nodes);
            else
                manager.append(null, nodes);
        }
        function removeTreeItem()
        {
            var node = manager.getSelected();
            if (node)
                manager.remove(node.target);
            else
                alert('请先选择节点');
        }
        function updateTreeItem()
        {
            var node = manager.getSelected();
            if (node)
                manager.update(node.target, { text: $("#txtNode").val() });
        }
        function clearTreeItem()
        {
            manager.clear();
        }
    </script>
</head>
<body style="padding:10px">
    <input type="text" class="l-text" value="节点名" id="txtNode" style="display:block; float:left; margin-right:10px;" /> 
    
    <a class="l-button" onclick="reload()" style="float:left;margin-right:10px;">重新加载</a>

    <a class="l-button" onclick="addTreeItem()" style="float:left;margin-right:10px;">增加节点</a>
    <a class="l-button" onclick="updateTreeItem()" style="float:left;margin-right:10px;">更新节点</a>
        <a class="l-button" onclick="removeTreeItem()" style="float:left;margin-right:10px;">删除节点</a>
     <a class="l-button" onclick="clearTreeItem()" style="float:left;margin-right:10px;">清空节点</a>

     <a class="l-button" onclick="addTreeItem2()" style="width:150px;float:left;margin-right:10px;">增加节点(带子节点)</a>
    <br />
     <br />
     <!-- 带复选框和图标 -->
    <div style="width:200px; height:300px; border:1px solid #ccc; overflow:auto; clear:both;">
    <ul class="l-tree">
        <li>
            <span>节点1</span>
            <ul>
                <li>
                    <span>节点1.1</span>
                     <ul>
                        <li><span>节点1.1.2</span></li>
                        <li><span>节点1.1.2</span></li>
                     </ul>
                 </li>
                 <li><span>节点1.2</span></li>
            </ul>
        </li> 
        <li><span>节点2</span></li>
        <li isexpand="false">
            <span>节点3</span>
            <ul>
                <li><span>节点3.1</span></li>
                <li><span>节点3.2</span></li>
            </ul>
        </li>
    </ul>
    </div>

        <div style="display:none">
     
    </div>
</body>
</html>