jsTree застрял на "загрузке" на IE8 - PullRequest
3 голосов
/ 06 июля 2011

У меня есть деревья на двух разных страницах, на обеих тоже есть много других функций.Они оба прекрасно работают в Firefox, но IE8 застревает на «Загрузка ..», без видимых сообщений об ошибках (у меня не установлено devtools для IE8, так как я не знаю ни одного).

Я посмотрел в Интернете и обнаружил, что должен объявить тип документа, что я и сделал, но это не помогло.Я также попытался разделить страницы до самого необходимого + jstree, но дерево все еще не работало.

Вот код.Я удалил некоторые части, которые, на мой взгляд, не являются необходимыми (хотя, учитывая проблему, они могут быть).

Мне кажется, я видел где-то на домашней странице jstree упоминание о том, что какое-то имя переменной и IE несовместимычто-то вроде "использовать идентификатор вместо имени"?Может ли моя проблема быть из-за чего-то подобного?Я также понимаю, что некоторые проблемы с IE связаны со странным способом, которым IE обрабатывает версии (или что-то еще, я не совсем понимаю)Что это значит и может ли это быть источником моей проблемы?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
TR/xhtml11/DTD/xhtml11.dtd">

<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
   pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
-SNIP-
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/
jqueryui/1.8.3/themes/base/jquery-ui.css" type="text/css" />
   <script src="<%= hostUrl %>/js/jquery-1.4.2.js" type="text/
javascript"></script>
   <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/
jquery-ui.js" type="text/javascript"></script>
   <script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/
jquery.bgiframe-2.1.1.js" type="text/javascript"></script>
   <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/i18n/
jquery-ui-i18n.min.js" type="text/javascript"></script>
<script src="<%= hostUrl %>/js/jsTree/jquery.jstree.js" type="text/
javascript"></script>
   <link rel="stylesheet" type="text/css" href="/WebUI2/js/jsTree/themes/
css/style.css" />
   <script type="text/javascript" src="/WebUI2/js/jsTree/themes/js/
jquery-ui-1.8.13.custom.min.js"></script>
-SNIP-
<script>


$(function () {

   $("#tree")

   .jstree({
           "json_data" : {
                   "ajax" : {
                           "url" : "getAreaTree?treeType=Areas&ownerPhone=<
%=webSessionObject.getUserPhoneNum()%>",
                           "data" : function (n) {
                       return { id : n.attr ? n.attr("id") : 0 };
                   }
                   }
           },

           types : {
                   types : {

                           "folder" : {

                           },
                           "file" : {
                                   "valid_children" : "none"
                           }
                   }
           },

           checkbox : {
                   "real_checkboxes" : "true",
                   "override_ui" : "true",
                   "real_checkboxes_names" : function(n){
                           console.log("Aasd");
                           return[("area"+n[0].id),n[0].id];
                   }
           },

           themes : {
                   theme : "apple"
           },

           "plugins" : ["json_data", "ui", "checkbox", "types", "themes" ]
   });




});
</script>

<div class="box_start">
 <div class="box_content">
   <h1><fmt:message key="owner.text.areas" /></h1>
    <div id="tree"style="overflow:auto border:none"></div>
       <br />
   </div>
   <div class="box_end"></div>
 </div>

Эта копировальная паста предназначена для другого форума, и с тех пор я внес некоторые изменения.Я обновил jQuery до его последней версии (1.6.2) и удалил некоторые самозакрывающиеся теги (ссылки, входы, разрывы).

Вот фрагмент моего JSON (это не весь JSON), поэтому могут быть ошибки в скобках).В обновленной версии вместо "x" используется "idx", где x - это число.

[{ "data" : "Areas", "attr" : { "id" : "1", "rel" : "folder" }, "state" : "open",
"children" : [{ "data" : "[Testi]", "attr" : { "id" : "261", "rel" : "folder" },  
"state" : "closed", 
"children" : [ ] } , { "data" : "TESTI", "attr" : { "id" : "11", "rel" : "folder" },   
"state" : "closed", 
"children" : [{ "data" : "[ Kansio ]", "attr" : { "id" : "271", "rel" : "folder" }, 
"state" : "closed", 
"children" : [ ] } , { "data" : "[ folder ]", "attr" : { "id" : "281", "rel" : 
"folder" }, "state" : "closed", 
"children" : [ ] } ] }]

PS.Извините за плохое форматирование, все еще не могу справиться с SO ^^ ;;

Ответы [ 2 ]

1 голос
/ 07 июля 2011

Хм, да, я нашел ответ. IE8 зависает, потому что дерево слишком большое. Я вырезал около половины записей из JSON, и дерево загружается просто отлично.

Я сообщу, если найду способ обойти это.

edit: я обновил OpenLayers (еще один плагин с открытым исходным кодом, этот используется для рисования карт), и jsTree начал работать. Я думал, что использовал новейшую версию OpenLayers, но у нас были проблемы с нашим svn пару дней назад, поэтому я думаю, что я не работал над абсолютно новой версией в конце концов.

На этот вопрос дан ответ. Я удалю через день или два, так как сомневаюсь, что это будет полезно для всех («если вы используете jstree и старую версию OpenLayers, IE8 может зависнуть»…? Riight). Если проблема снова появится, я лучше начну новый вопрос, чем продолжу здесь.

0 голосов
/ 07 июля 2011

Ваш идентификатор не должен быть числами, поскольку DOM не может обрабатывать определенные случаи для идентификаторов элементов.Обычные числа, и эти символы недопустимы (!"#$%&'()*+,./:;<=>?@[\]^ {|} ~ `).Используйте id1 вместо 1.

Я обнаружил, что jstree имеет некоторые большие проблемы с jquery 1.6.2 и не может получить никаких отзывов о группах jstree google, поэтому подумайте об этом, прежде чем двигаться дальше.

Я проверил ваш json, опубликованный выше, и обнаружил, что он тоже неверный: вам нужно закрыть начальные [и {

Вот правильный json, за исключением идентификаторов:

[
    {
        "data": "Areas",
        "attr": {
            "id": "1",
            "rel": "folder"
        },
        "state": "open",
        "children": [
            {
                "data": "[Testi]",
                "attr": {
                    "id": "261",
                    "rel": "folder"
                },
                "state": "closed",
                "children": []
            },
            {
                "data": "TESTI",
                "attr": {
                    "id": "11",
                    "rel": "folder"
                },
                "state": "closed",
                "children": [
                    {
                        "data": "[ Kansio ]",
                        "attr": {
                            "id": "271",
                            "rel": "folder"
                        },
                        "state": "closed",
                        "children": []
                    },
                    {
                        "data": "[ folder ]",
                        "attr": {
                            "id": "281",
                            "rel": "folder"
                        },
                        "state": "closed",
                        "children": []
                    }
                ]
            }
        ]
    }
]
...