Answer 1

结果是一个简单的JQuery和一个Web服务来返回渲染的节点。

任何具有子项的节点都使用文本“Loading ...”进行初始化，以便脚本知道尝试检索它们。

<script type="text/javascript" language="javascript">
    var imageTypeExpression = "img[imgType='exp'][src$='plus.gif']";
    var maxRetries = 5;
    jQuery(document).ready(function() {
        jQuery("#T_TreeListCtl " + imageTypeExpression).click(imageClick);
        jQuery("#tdLists").show();
    });

    function imageClick() {
        var parentDivId = jQuery(this).parent().attr('id');
        var nodesDiv = '#M_' + parentDivId;
        if (jQuery(nodesDiv).text() == 'Loading...') {
            getNodes(parentDivId, nodesDiv, maxRetries);
        }
    }

    function getNodes(parentDivId, nodesDiv, retryCount){
        if (retryCount == 0) {
            jQuery(nodesDiv).html("<div>Loading... failed.</div>");
        }
        else {
            jQuery.ajax({ type: "POST",
                url: "WebServices/TreeNodes.asmx/GetChildNodes",
                data: "{'parentId' :'" + parentDivId + "'}",
                dataType: "json",
                contentType: 'application/json; charset=utf-8',
                success: function(json) {
                    var result = eval("(" + json.d + ")");
                    jQuery(nodesDiv).html(result.value);
                    jQuery(imageTypeExpression, nodesDiv).click(imageClick);
                },
                timeout: 100,
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    if (textStatus == 'timeout') {
                        getNodes(parentDivId, nodesDiv, retryCount - 1); //keep trying
                    }
                }
            });
        }
    }
</script>