0

我遇到了一个非常奇怪的问题。我在我的一个站点上使用来自 JQueryUI 的 jsTree,并且我在不同的 .js 文件中使用了不同的实现。其中一个似乎工作,这非常令人困惑,因为它使用几乎相同的代码(只有变量名不同)到被破坏的实现。问题来自上下文菜单功能。我正在使用的代码如下:

$(document).ready(function () {
    if(typeof dryerList == 'undefined' || dryerList.length == 0) {
        var dryerList = [];
        $.ajax({
            url:'../TrackingApp/getGrainBins.php?t=234.23423452353',
            async: false,
            success: function(text) {
                try {
                    dryerList = $.parseJSON(text);
                } catch (e) {
                    alert('ERROR: ' + e);
                }

                if(dryerList.length == 0) {
                    alert('ERROR: No fleet data received.')
                }
            }
        });
    }

    $("#dryerListTree").jstree({
        plugins : ['json_data', 'ui', 'themes', 'contextmenu'],
        contextmenu: {items: customBinMenu},
        json_data : { data: binNodes }
    });

    $('#dryerListTree').bind("dblclick.jstree", function (event) {
        var node = $(event.target).closest("li");
        var id = node[0].id;

        for(i=0; i < dryerList.length; i++) {
            if(id == dryerList[i].id) {
                centerMap(dryerList[i].y, dryerList[i].x);
                break;
            }
        }
    });
});


function customBinMenu(node) {
    if ($(node).hasClass("folder")) {
        return;
    }

    var items = {
        centerItem: {
            label: "Locate",
            action: function () {
                // Centers map on selected bin
                var id = node[0].id;

                for(i=0; i < dryerList.length; i++) {
                    if(id == dryerList[i].id) {
                        centerMap(dryerList[i].y, dryerList[i].x);
                        break;
                    }
                }
            }
        },
        dashboardItem: {
            label: "Dashboard",
            action: function () {
                // Opens dryer info window over map
                var id = node[0].id;
                var dryerIndex = -1;

                for(i=0; i < dryerList.length; i++) {
                    if(id == dryerList[i].id) {
                        dryerIndex = i;
                        break;
                    }
                }
            }
        }
    };

return items;
}

奇怪的是,双击处理程序工作得很好。当我到达 customBinMenu() 函数时,dryerList 数组就在那里,并且dryerList[0] 包含它应该包含的 5 个值中的 4 个 - 但不知何故,“id”元素已从该对象中删除。我已经研究了很长时间,但我无法弄清楚它如何在不丢失任何其他数据的情况下从对象中删除单个元素,尤其是当相同的代码适用于类似列表时。有什么建议么?

4

1 回答 1

1

好的,我在你的问题中读到:'并且dryerList [0]包含它应该的5个值中的4个-但不知何故'id'元素已从该对象中删除'
所以'元素''值'我假设你意思是“属性”:准确地说是节点的“id”属性??

我在你的代码中看到:var id = node[0].id;

那应该是:var id = node[0].getAttribute("id");

祝你好运!

更新 1:
好的,如果(根据您的评论)var id = node[0].id;(从节点 [0] 获取 id)没问题,那么if(id == dryerList[i].id)看起来是错误的,因为您只是(重新)将 id 定义为节点 [0] 的 id 的值。
实际上,我不会使用 'id' 作为 var-name(在这种情况下)。

那么,如果你这样做了:var idc = node[0].getAttribute("id");
然后:if(idc === dryerList[i].getAttribute("id"))

更新5:顺便说一句,您仍然有一些错误:

  • 您忘记了一个分号来关闭警报:
    if(dryerList.length == 0) { alert('ERROR: No fleet data received.') }
  • 您应该使用 '===' 与第 2 行和第 14 行的 '0' 进行比较
  • 自然地,在现实生活中,您会在将函数 customBinMenu(node) 用于您的 document.ready 函数之前定义它。
    通过交换代码顺序修复。
  • 对于这个 document.ready 函数也是如此,您在定义之前使用了 var dryList。
    修复者:var dryerList = dryerList || []; if(dryerList.length === 0){//ajax & json code}

您能否确认一下这个现在是有效的 javascript的小提琴是否代表您预期的基线代码,这仍然会导致您在dryerList 的节点集合中“id”属性为“未定义”的问题(因为您发布的代码包含一些此 jsfiddle 中修复的简单错误,不包括更新 1 中提到的内容,因为您评论说这不是问题)?

请问(既然你从 document.ready 开始),你为什么(仍然)检查dryerList 是否已经存在?
请问您是否可以用一些演示数据更新更正的小提琴供我们玩弄?

于 2012-08-08T17:21:33.790 回答