1

对于那些在问题之前想要解决方案的人：

1) 在真正创建之前不要使用 getElementById() 读取元素：参见 windows.onload。

2 ) 如果你使用 XMLHTTPRequest 和 AJAX 的东西，调用你 getElementById() ，或者解锁这个函数，在回调中，（xhr_object.readyState == 4 部分你的请求）。

在我的情况下，我调用我的页面而不使用所需的回调（noobish Ctrl-C Ctrl-V 样式）。

这是问题：

我在 HTML/Javascript 代码中遇到了一个奇怪的情况。此代码的目的是通过 JS 函数获取 HTML 输入（输入文本）的值。

上下文是一个主 HTML 页面加载我所有的 JS 函数，并通过 HTTPRequest 在子 div 中按需加载 HTML 内容。

加载 div 后调用所选代码。

这是我必须阅读的 PHP 生成的输入字段：

    <input id="listejf" type="text" value="6|7|">

这是我的 JavaScript 调用：

    listejf=document.getElementById('listejf').value;
    alert(listejf);

此代码不起作用。Firebug 发给我：

类型错误：document.getElementById("listejf") 为空

getElementById奇怪的是，如果我这样调用它，我可以让它工作alert：

    alert(document.getElementById("listejf"));
    listejf=document.getElementById('listejf').value;
    alert(listejf);

第一个alert显示null，但第二个显示“6|7|”，如预期的那样。

现在，2个问题：

  • 为什么警报使它起作用？
  • 如何在不到处发出警报的情况下使其工作？

重新编辑，代码不见了：

这是主要的 HTML 页面：main.html

<head>
    <script type="application/javascript" src="./preload.js"></script>
</head>
<body>
    <a href="#" onCLick="CallPagen()">Link</a>
    <div id="targetid"></div>
</body>

preload.js 看起来像这样：

function CallPagen() {
    envoieRequete('./PageN.php', 'targetid');
}

function mytestfunction() {
    listejf = document.getElementById('listejf').value;
    alert(listejf);
}

function envoieRequete(url, id) {
    var xhr_object = null;
    if (window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
    else if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
    xhr_object.open("GET", url, true);
    xhr_object.onreadystatechange = function () {
        if (xhr_object.readyState == 4) {
            if (!document.getElementById(id)) {
                alert("id pas trouvé " + id);
            }
            document.getElementById(id).innerHTML = xhr_object.responseText;
            mytestfunction();
        }
    };
    xhr_object.send(null);
}

PageN.php 只是用填充的值回显 inputtext 字段。

4

2 回答 2

3

“......如果我通过这样的方式调用getelement，我可以让它工作alert......”

这几乎总是意味着您正在发出异步AJAX 请求。

“为什么 alert 让它起作用？”

发生的情况是alert下一行代码的处理延迟了足够长的时间以使响应返回。

如果没有alert，下一行代码将立即运行，并且该元素尚不可用。

“我怎样才能让它在不到处发出警报的情况下工作？”

这是一个非常普遍的问题。解决方案是您需要将任何依赖于 XMLHttpRequest 请求响应的代码放入请求的回调中。

因此，如果您通过本机 API 发出请求，您将添加一个onreadystatechange回调......

xhrRequest.onreadystatechange = function() {
    if (xhrRequest.readyState === 4) {
        // append the response text to the DOM

        listejf=document.getElementById('listejf').value;
        alert(listejf);
    }
}
于 2012-08-04T16:30:42.063 回答
1

您应该在 DOM 准备好之后运行代码，当alert()被调用时，文档正在加载并且浏览器有时间创建 DOM 对象，请尝试以下操作：

load 事件在文档加载过程结束时触发。至此，文档中的所有对象都在 DOM 中，所有图片和子帧都加载完毕。

window.onload = function() {
    var listejf = document.getElementById('listejf').value;
    alert(listejf);
};
于 2012-08-04T16:18:29.597 回答