javascript数组到数组

Question

我下载了一个网格:ParamQuery 网格，我需要向它添加项目，我对 javascript 很陌生，但正如我所见，它使用一个变量数据将其记录保存在数组数组中，如下所示:

var data = [['hello','byebye']]

我需要从 ini 文件中添加这些记录，所以现在我有这样的代码:

$(function () {

var allText =[];
var allTextLines = [];
var Lines = [];
var txtFile = new XMLHttpRequest();
var linenumber = 0; 
var data = new Array();

txtFile.open("GET", "automaticlang_EN.ini", true);
allText = txtFile.responseText;
txtFile.onreadystatechange = function()
{
    if (txtFile.readyState == 4)
    {

              // Makes sure it's found the file.
                allText = txtFile.responseText;
                allTextLines = allText.split(/\r\n|\n/);
                var data = new Array([allTextLines]);

                console.log(data[0]);
            } else { 
            }

    }
txtFile.send(null)
//console.log(data);


//var data = [['hello','byebye']] //this works


    var obj = { width: 700, height: 700, title: "Translation  Grid",resizable:true,draggable:true };
    obj.colModel = [{ title: "ID", width: 100, dataType: "string" },
    { title: "Translation", width: 200, dataType: "string" }];
    obj.dataModel = { data: data };
    $("#grid_array").pqGrid(obj);

});

我没有给我结果我做错了什么？

Answer 1

您的代码不工作的原因是您试图在 XMLHttpRequest 回调之外使用您的 data 变量。您尝试使用 data 的代码会在您发出 GET 请求后立即运行，而不是在从服务器返回值后运行。

因此，您需要解决的主要问题是在XMLHttpRequest 回调中 设置pqGrid()。

为了好玩，我为你调整了一些其他的东西:

• 由于您使用的是 jQuery，因此您可以使用 $.ajax() 而不是繁琐的 XMLHttpRequest。
• 添加了一个 $.trim(allText) 调用以删除任何前导或尾随空格。特别是这将删除所有尾随换行符，因此如果最后一行末尾有换行符，您的数组中将不会有额外的空字符串。
• 为 .split() 使用了一个稍微简单的正则表达式。
• 只使用了一个数组文字而不是 new Array。正如 nkron 指出的那样，同时拥有 new Array 和 数组字面量为您提供了比您想要的多一级的嵌套数组。数组文字几乎总是比 new Array 更具可读性。
• 重新安排了 pqGrid 设置对象的设置。您执行此操作的方式没有任何问题(除了很长的行)，只是在此处展示了另一种设置方法。
• 清理了缩进和长行。

$(function() {
    $.ajax({
        url: "automaticlang_EN.ini",
        dataType: "text"
    }).done( function( allText ) {
        var allTextLines = $.trim(allText).split(/\r?\n/);
        var data = [ allTextLines ];

        $("#grid_array").pqGrid({
            width: 700,
            height: 700,
            title: "Translation  Grid",
            resizable: true,
            draggable: true,
            colModel: [
                {
                    title: "ID",
                    width: 100,
                    dataType: "string"
                }, {
                    title: "Translation",
                    width: 200,
                    dataType: "string"
                }
            ],
            dataModel: {
                data: data
            }
        });
    });
});