Перенос jsTree в функцию и передача переменных не работает, если функция не находится в том же документе, что и вызывающий объект

#javascript #jstree

#javascript #jstree

Вопрос:

Если моя функция инициализации jsTree находится в том же файле, что и вызывающая, все работает, но если я перемещаю вызов функции в html-документ, он ничего не возвращает. Вот код, который я придумал до сих пор:

 function cattree(treeID, treeAncestors, treeCurrent) {
        alert(treeID   treeAncestors   treeCurrent);
        $("#" treeID).jstree({ 
            "core" : { 
                "initially_load" : treeAncestors,
            },

            "ui" :{
                "select_limit" : 1,
                "initially_select" : [treeCurrent],
            },
            "json_data" : {
                "progressive_render" : true,
                "progressive_unload" : true,
                "ajax" : {
                    "url" : "/taxonomy/catjson",
                    "dataType": "text json",
                    "data" : function (n) { 
                        return { id : n.attr ? n.attr("id") : 0 }; 
                    }
                }
            },
            "plugins" : [ "themes", "json_data", "ui" ],
        });
}
  

Когда я перемещаю его в документ, я думаю, что он не ожидает загрузки документа с функцией.

    $(document).ready(function(){
        cattree("demo", ['4e974c91f0282e7011000004', '4e974d92f0282ec41a00000a'], ['4e974da1f0282e2c0c000000']);
   }
   );
  

Комментарии:

1. Это может быть проблема с синхронизацией / последовательностью. Можете ли вы предоставить образец jsfiddle?

2. Я считаю, что это была проблема с вызовом функции до загрузки внешнего js.

Ответ №1:

Вот что получилось:

инициализация cattree во внешнем файле

 (function () {
    if(jQuery amp;amp; jQuery.jstree amp;amp; jQuery.cattree) { return; }
    (function ($) {
        $.cattree = function(treeID, treeAncestors, treeCurrent) {
            //alert(treeID   treeAncestors   treeCurrent);
            //tree initialization function to possibly allow one or more tree on page.
            $("#" treeID).jstree({ 
                "core" : { 
                    "initially_load" : treeAncestors,
                },

                "ui" :{
                    "select_limit" : 1,
                    "initially_select" : treeCurrent,
                },
                "json_data" : {
                    "progressive_render" : true,
                    "progressive_unload" : true,
                    "ajax" : {
                        "url" : "/taxonomy/catjson",
                        "dataType": "text json",
                        "data" : function (n) { 
                            return { id : n.attr ? n.attr("id") : 0 }; 
                        }
                    }
                },
                "plugins" : [ "themes", "json_data", "ui" ],
            });

        }
    })(jQuery);
})();
  

И код в разделе head или, я думаю, ниже всего html:

 $(document).ready(
    function(){
    $.cattree("demo", ['4e974c91f0282e7011000004', '4e974d92f0282ec41a00000a'], ['4e974da1f0282e2c0c000000']);
    }
);
  

На данный момент это работает довольно хорошо. И я думаю, что проблема заключалась в том, что функция была вызвана до того, как все было загружено. Как и до добавления Jquery.cattree в оператор if, он не смог распознать $.cattree как функцию.