javascript - JsTree 选择被逆转

Question

所以我的问题是，基本上，我在 JsTree 中设置了一些节点，它在我的页面上已有的一棵树上工作，但那些动态加载的节点只会恢复选择。这意味着它们确实按预期被选中，但随后由于某种原因被取消选择。

选择代码:

selected.forEach(function(element,index,array){
    if(element !== null)
        $(value).parent().find(".filter-value-tree").jstree("select_node", "#"+element);
});

以及jquery-2.1.1.js中的代码行:

return typeof n !== U && n.event.triggered !== b.type ? n.event.dispatch.apply(a, arguments) : void 0

在该特定行之前，按照预期选择节点。

显示我正在尝试做的事情的基础知识的片段(它现在似乎重现了问题):

$("#testBtn").on("click", function() {
  loadTree(getValueTree);


  $("#filter-value-tree").jstree("select_node", "#2");
});

function loadTree(callback){
  //Normally there would be a ajax request here, to be used with differenct callback functions
  var response = '<li id="1">Information</li><li id="2">Service</li><li id="3">Claim</li><li id="4">Education</li>';
  
  setTimeout(function(){
    callback(response);
  }, 1000);
}

function getValueTree(result){
    $("#testDiv").append("<div id='filter-value-tree'><ul><li id='1'>Test1</li><li id='2'>Test2</li></ul></div>");

    $("#filter-value-tree").find("ul").append(result);

    $("#filter-value-tree").jstree({
        'core' : {
            'check_callback': true,
            'multiple': true
        },
        "plugins" : [ "changed" ]
    });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />

<button type="button" id="testBtn">Test</button>

<div id="testDiv"></div>

为了结束它，提供更多信息，我正在使用 AJAX 从我的 mysql 数据库的 php 页面加载 jstree 的内容。 ajax 调用设置为 async: false，就好像有人想知道它是否可以那样。加载按预期工作，我只想说节点正在被选中，但只是在一段时间后被取消选中(如果我在 jquery-2.1.1.js 的那一行逐步调试，那么之前的最后一件事调试器完成)。

我希望你能帮助我，在此先感谢。

Answer 1

您遇到的问题与同步/异步代码有关:

在这段代码中:

loadTree(getValueTree);
$("#filter-value-tree").jstree("select_node", "#2"); 

...最后一条语句在 getValueTree 被调用之前执行。这是因为 loadTree 将执行 Ajax 调用，但会立即返回而不调用回调。仅当响应将通过异步事件传入时才调用回调。在您当前的代码完成运行(即清空调用堆栈)之前，永远不会处理此事件。只有这样队列中的事件才会被处理。

要解决这个问题，将该语句移到回调部分，例如，如下所示:

loadTree(function () {
    getValueTree();
    $("#filter-value-tree").jstree("select_node", "#2"); 
});