Question

是否可以在执行脚本expandNextLevel（）后打开窗口？我问这个是因为我不想让客户看到展开/折叠动画，只是树视图崩溃了。这是我的代码。

<script type="text/javascript">
    $(function () {

        $(".k-gantt").click(function () {

            expandNextLevel();        


            var windowWidget = $("#window");

                windowWidget.data("kendoWindow").open().center();

                $.ajax({
                    type: 'GET',
                    url: '/Act/load',
                    contentType: 'application/json; charset=utf-8',

                    success: function (result) {
                    },
                    error: function (err, result) {
                        alert("Error" + err.responseText);
                    }
                });





        function expandNextLevel()
        {
            setTimeout(function () {
                var treeview = $("#treeview").data("kendoTreeView");

                var b = $('.k-item .k-plus').length;
                treeview.expand(".k-item");
                treeview.trigger('dataBound');
                if (b > 0) {
                    expandNextLevel();
                    collapseNextLevel();
                }
            }
            , 200);
        };

        function collapseNextLevel()
        {            
            setTimeout(function () {
                var treeview = $("#treeview").data("kendoTreeView");
                var b = $('.k-item .k-minus').length; 
                treeview.collapse(".k-item");
                treeview.trigger('dataBound');
                if (b > 0) {
                    collapseNextLevel();
                }
            }
            , 200);
        };

    </script>

此致

Answer 1

我认为做这样事情的最快方法是将所有内容放在一个隐藏的div中，然后当你完成代码执行时，你将会显示出来。您还可以在执行代码时将带有旋转图标的可见div放置，并在显示主要内容时隐藏它以使用户知道正在发生的事情。

编辑：我对expand函数做了一些修改，通过添加每次递增的索引，我应该知道它何时完成了递归。在函数结束时，只有当索引等于1时才会执行代码，这意味着函数的第一个实例已完成执行。

<script type="text/javascript">
$(function () {

    $(".k-gantt").click(function () {

        expandNextLevel(0);        


        var windowWidget = $("#window");

            windowWidget.data("kendoWindow").open().center();

            $.ajax({
                type: 'GET',
                url: '/Act/load',
                contentType: 'application/json; charset=utf-8',

                success: function (result) {
                },
                error: function (err, result) {
                    alert("Error" + err.responseText);
                }
            });





    function expandNextLevel(var i)
    {
        i++;
        setTimeout(function () {
            var treeview = $("#treeview").data("kendoTreeView");

            var b = $('.k-item .k-plus').length;
            treeview.expand(".k-item");
            treeview.trigger('dataBound');
            if (b > 0) {
                expandNextLevel(i);
                collapseNextLevel();
            }
            if (i == 1)
            {
               $.("#maincontent").show();
            }
        }
        , 200);
    };


    function collapseNextLevel()
    {            
        setTimeout(function () {
            var treeview = $("#treeview").data("kendoTreeView");
            var b = $('.k-item .k-minus').length; 
            treeview.collapse(".k-item");
            treeview.trigger('dataBound');
            if (b > 0) {
                collapseNextLevel();
            }
        }
        , 200);
    };

</script>

你应该把你的内容放在div

中

<div id="maincontent" style="display:none;">
    /*your content*/
</div>

我没有测试它，但它应该有效：）

有一种更好的方法可以使用jQuery.when，jQuery.done和promises，但我不相信我可以给你一个工作样本，因为我从未使用过那些方法

Answer 2

试试这个

$.when(expandNextLevel()).done(function(){
    /// show window
});

docs https://api.jquery.com/jquery.when/

脚本执行后打开窗口

2 个答案: