如何取消 jsTree 的最后一次调用（使用 $.jstree()）？

Question

使用 jsTree 1.0-rc3

使用 JS 树我有一个下拉细化器。这会将调用的内容设置为加载到树中。但是在每次调用时树都会更新而不会中止最后一次调用，因此如果它们 return 在较新的调用之后，您可以让树显示旧调用。

如何取消上次通话？

// On change, update tree
$('#entitySelector1').change( function () {
    ....
    applyJstree(1);
}

var applyJstree = function(num) {
    $('#ent{0}'.format(num)).jstree({
            "plugins" : ["themes","json_data","dnd","search","types","ui","contextmenu", "overlay", "hotkeys"],
            "core" : { 
                "initially_open" : [ "tree{0}_root".format(num) ] ,
                "animation" : 100
            },          
            "json_data" : { 
                "ajax" : {
                    "url" : function ( currentNode ) {
                        var currentEntity = $('#entitySelector{0}'.format(num)).val();
                        var maxResults = treeSettings['ent{0}maxResults'.format(num)];

                        if (currentNode === 'ent{0}_root'.format(num) || currentNode === -1){
                            return 'treeAjaxServer.php?action=init&entityId=' + $('#entitySelector{0}'.format(num)).val() 
                                + '&sort=' + treeSettings['ent{0}sortMode'.format(num)]
                                + '&sortDirection= ' + treeSettings['ent{0}sortDirection'.format(num)]
                                + '&needle=' + $('#search{0}'.format(num)).val()
                                + '&projectId=' + $('#projectFilter{0}'.format(num)).val()
                                + '&showChildCount=' + treeSettings['ent{0}childCount'.format(num)]
                                + '&maxResults='+maxResults;
                        } else {
                            return 'treeAjaxServer.php?action=branch&entityId=' 
                                + $('#entitySelector{0}'.format(num)).val() + '&sort=' 
                                + treeSettings['ent{0}sortMode'.format(num)]
                                + '&projectId=' + $('#projectFilter{0}'.format(num)).val()
                                + '&sortDirection= ' + treeSettings['ent{0}sortDirection'.format(num)]
                                + '&showChildCount=' + treeSettings['ent{0}childCount'.format(num)];
                        }
                    }, 
                    "data" : function ( node ) {
                        var currentEntity = $('#entitySelector{0}'.format(num)).val();
                        var maxResults = treeSettings['ent{0}maxResults'.format(num)];

                        if (node === -1){
                            return {'prefix' : 'tree{0}_'.format(num),"maxResults" : maxResults};
                        } else {
                            return { //Send this to the server with the ajax request
                                "prefix" : "tree{0}_".format(num),
                                "parentNodeId" : node.attr("id"),
                                "maxResults" : maxResults,
                                "showChildCount" : treeSettings['ent{0}childCount'.format(num)]
                            };
                        }
                    }
                }
            }
    });
}

我所追求的是如何更新数据源，并且在多次调用的情况下（经常发生）中止之前的调用。

Answer 1

您必须缓存 ajax 调用，然后在每次启动另一个调用时中止它。

// On change, update tree
$('#entitySelector1').change( function () {
    ....
    applyJstree(1);
}


var applyJstree = function(num) {
     getAjaxDataForTree(num);
}


var xhr = false;
function getAjaxDataForTree(num) {
   if (xhr) {
      xhr.abort(); // abort if ajax call is going on
   }

   // cache tree element to access it in the callback
   var $jsTree = $('#ent{0}'.format(num)).jstree(); 

   // cache ajax call
   xhr = $.ajax({
        type: ...,
        url: ...,
        success: function(data){
           $jsTree.settings.core.data = data; // update tree
           $jsTree.refresh();
        }
    });
}

演示 - Fiddle Demo，但这是 jsTree v.3

如何取消 jsTree 的最后一次调用（使用 $.jstree()）？

How can I cancel the the last call of a jsTree (using $.jstree())?

jquery

jstree