一个带有 2 个输出的 ajax 循环错误 innerHTML

Posted 2023-05-07

【中文标题】一个带有 2 个输出的 ajax 循环错误 innerHTML

【英文标题】：one ajax loop with 2 outputs error innerHTML

【发布时间】：2016-09-13 06:06:23

【问题描述】：

在尝试将此函数输出到 ajax 表（工作正常）和名为 connectedList1 的输入框时遇到一些问题。

我不能让它正确地吐到输入框中，错误是

未捕获的类型错误：无法将属性“innerhtml”设置为 null

和

connectsList1 未定义

 function getConnections(txt1) 

                    func_getConnections(
                function (response) 
                    var sortorder = txt1;
                    var arr = response;
                    var i;
                    var Count;
                    var mCount;
                    var oCount;
                    var out =
                       "<thead>"
                    for (i = 0; i < arr.length; i++) 
                        out +=
                        "<tr>" +
                        "<tbody>" +
                        "<tr class=\"" + ReturnValuesAsColor(arr[i].o, arr[i].m, arr[i].server_proc) + "\">" +
                        "<td>" + arr[i].id + "</td>" +
                        //"<td>" + arr[i].user_id + "</td>" +
                        "<td>" + arr[i].user_name + "</td>" +
                        "<td>" + arr[i].workstation_name + "</td>" +
                        "<td>" + (!!arr[i].ip_address ? arr[i].ip_address : '') + "</td>" +
                        "<td>" + formatDateTime(arr[i].connect_date, 'datelongtime') + "</td>" +
                        "<td>" + formatDateTime(arr[i].refresh_date, 'datelongtime') + "</td>" +
                        "<td>" + (!!arr[i].app_ver ? arr[i].app_ver : '') + "</td>" +
                        "<td>" + (!!arr[i].app_date ? formatDateTime(arr[i].app_date, 'shortdate') : '') + "</td>" +
                        "<td>" + Messages_flag(arr[i].get_messages_flag) + "</td>" +
                        "<td>" + FixNumbers(arr[i].message_type_flags) + "</td>" +
                        //"<td>" + arr[i].o + "</td>" +
                        //"<td>" + arr[i].m + "</td>" +
                        "<td>" + arr[i].group_name + "</td>" +
                        //"<td>" + arr[i].server_proc + "</td>" +
                        "<td> <button id=\"DelImg1\" type=\"button\" name=\"btnsubmit\" class=\"ui-button ui-widget ui-state-default ui-corner-all\" onclick=\"clearText('<%= result.ClientID%>'); CopyId(" + arr[i].id + "); return Message(" + arr[i].id + ")\"  >Delete</button> </td>" +
                        "</tr>" +
                        "</tbody>";

                        mCount = 0
                        if (arr[i].m != 0) 
                            mCount += 1;
                         else if (arr[i].o != 0) 
                            oCount += +1;
                         else if (arr[i].o == 0 & arr[i].m == 0) 
                            Count += 1;
                        

                        document.getElementById("dtBody1").innerHTML = out;

                        document.getElementById('ConnectsList1').innerHTML = out;

                        ConnectsList1 = "      Connection list: " & Count + oCount + mCount & " connection(s)     Main Application : " & Count & "     Online : " & oCount & "     Mobile : " & mCount;
                    );

欢迎任何帮助或建议，我自己还在学习 ajax

【问题讨论】：

那么，您在 DOM 中有一个元素为 id="dtBody1" 吗？你有id="ConnectsList1" 的元素吗？另请注意，循环重复覆盖元素的innerHTML 属性是没有意义的，因为后续循环迭代将覆盖之前循环迭代写入的任何内容。

一般来说，当遇到这类事情时，第一件事是使用浏览器内置的全功能调试器逐行逐行执行代码，示例变量和 DOM 在各个阶段的状态等

是的，我在 DOM 中同时拥有这两个元素。仍在研究循环，但会看看，谢谢。一直在使用 chrome 中的调试器。它反复覆盖innerHTML，因为它调用存储过程来更新实时连接列表。我再看看调试器

"是的，我在 DOM 中同时拥有这两个元素" 很抱歉，但很明显，您在运行此代码时不，或 getElementById 不会返回 null 并且您不会收到您列出的第一个错误。

【参考方案1】：

document.getElementById("dtBody1") 找不到任何 ID 为 dtBody1 的标签。确保您的 HTML 包含具有该 ID 的元素。 并且记得声明ConnectsList1变量以避免第二个错误。