javascript - 使用 $.parseJSON() 时无法遍历数组

Question

我有这段代码，当我点击一个按钮时它会创建一个表格。您在下面看到的代码完美无缺，当我单击我的按钮时，表格会在目标 div 中创建。但问题是，当我在 for 循环中将 dataArray 的索引从 0 替换为 i 时，表格没有显示，我在 Google Chrome 的控制台中得到这个错误

Uncaught TypeError: Cannot read property 'Device_Name' of undefined

$(document).ready(function()
{
    $(".button").click(function()
    {
        var clickBtnValue = $(this).val();
        var ajaxurl = 'ajax.php',

        data = {'action': clickBtnValue};

        $.post(ajaxurl, data, function (response) 
        {
            dataArray = $.parseJSON(response);
            var tbody = '';
            var theader = '<table><tr><td>#</td><td>Name</td><td>Id</td></tr>\n';

            for(i = 0; i <= dataArray.length; i++)
            {
                tbody += '<tr>';
                tbody += '<td>' + (i + 1) + '</td>';
                tbody += '<td>' + dataArray[0].Device_Name + '</td>';
                tbody += '<td>' + dataArray[0].Device_Id + '</td>';     
                tbody += '</tr>\n';     
            }

            var tfooter = '</table>';

            document.getElementById('dataTable').innerHTML = theader + tbody + tfooter;         
        });
    });
});

为什么我不能使用变量 i 作为数组的索引？

Answer 1

这个问题是因为你做的循环太多了。数组是 0 索引的，所以你想循环到长度 - 1。

这将允许您使用 i 访问数组:

for(var i = 0; i < dataArray.length; i++)
{
    tbody += '<tr>';
    tbody += '<td>' + (i+1) + '</td>';
    tbody += '<td>' + dataArray[i].Device_Name + '</td>';
    tbody += '<td>' + dataArray[i].Device_Id + '</td>';     
    tbody += '</tr>\n';  
}