Question

我有两个不同页面的树，都有很多其他页面功能也是。它们在Firefox中运行良好，但IE8卡住了在“正在加载...”，没有明显的错误消息（我没有为IE8安装的devtools，因为我不知道。）

我在网上看了一下，发现我应该声明一个doctype，哪个我做了但没有帮助。我也尝试将页面剥离到裸的必需品+ jstree，但树仍然无效。

这是代码。我已经拿出了一些我认为不是的部分必要的（虽然考虑到问题，但可能是）。

我想我在jstree主页的某个地方看到了一些提及变量名称和IE不兼容 - 类似于“使用id 而不是名字“？我的问题可能是因为这样的事情？我也了解一些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>

这个copypaste是另一个论坛，我已经做了一些改变。我已经将jQuery更新到它的最新版本（1.6.2），并且我已经删除了一些自闭标签（链接，输入，中断）。

这是我的JSON片段（它不是整个JSON，所以括号可能有错误）。更新后的版本使用“idx”而不仅仅是“x”，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 ^^ ;;

Answer 1

是的，我找到了答案。 IE8挂起，因为树太大了。我从json中删除了大约一半的条目，树加载得很好。

如果我找到解决办法的话，我会报告。

编辑：我更新了OpenLayers（另一个opensource插件，这个用于绘制地图），jsTree开始工作。我以为我使用的是最新版本的OpenLayers，但是几天前我们的svn出现了问题，所以我想我毕竟不是绝对最新版本。

因此，这个问题得到了回答。我会在一两天内删除，因为我怀疑这对任何人都有帮助（“如果你使用jstree和旧版本的OpenLayers，IE8可能会挂起来......”Riight）。如果问题确实再次出现，我宁愿开始一个新问题而不是继续这里。

Answer 2

您的ID不应该是数字，因为DOM无法处理元素ID的某些情况。普通数字和这些字符是不允许的（!"#$%&'()*+,./:;<=>?@[\]^ {|}〜`）。使用id1而不是1。

我发现jstree自jquery 1.6.2以来有一些重大问题，并且无法获得有关jstree google组的任何反馈，所以在向前推进之前请先考虑一下。

我已经检查了你上面发布的json并发现它也是错误的：你需要先关闭你[和{

这是正确的json禁止ID：

[
    {
        "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": []
                    }
                ]
            }
        ]
    }
]

jsTree坚持在IE8上“加载”

2 个答案: