需要明确的是，我的 JavaScript 代码是有效的。我使用 window.onload 调用初始函数，该函数获取时间和日期并通过 XMLHttpRequest 将其发送到远程服务器。在调试时的某个时候，我减少了初始功能，只是在屏幕上显示时间和日期，没有其他任何东西。
我发现当我执行后者时，刷新并不总是导致 window.onload 甚至被调用。即使使用 Crtl+F5 也很少改变时间。最后将其余代码放回(调用服务器)，每次刷新都有效!
下面的代码似乎没有为每次刷新调用 onload 事件。但是，如果您删除注释包围的 return 语句...每次刷新都会调用 window.onload。
虽然我不应该提示我的完整代码可以工作，但我想找出为什么简单版本不能工作？
<script>
window.onload = loadDoc();
function loadDoc() {
var today = new Date();
var date = today.getFullYear()+'-'+
( (today.getMonth()+1)<10 ? "0"+(today.getMonth()+1) : (today.getMonth()+1) ) +'-'+
( (today.getDate() +1)<10 ? "0"+(today.getDate() +1) : (today.getDate() +1) );
var time = ( (today.getHours())<10 ? "0"+(today.getHours()) : (today.getHours()) ) + ":" +
( (today.getMinutes())<10 ? "0"+(today.getMinutes()) : (today.getMinutes()) ) + ":" +
( (today.getSeconds())<10 ? "0"+(today.getSeconds()) : (today.getSeconds()) );
var dateTime = date+' '+time;
document.getElementById("myBanner").value=dateTime;
///////////////////////////////
return; //////remove this return and every refresh calls this function
///////////////////////////////
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("myBanner").value = this.responseText;
}
};
string = "http://example.com/cgi-bin/perly.pl?b=1&d=" + dateTime;
xhttp.open("GET", string, true);
document.getElementById("myBanner").value="sent";
xhttp.send();
}
最佳答案
您的代码实际上并未将事件监听器附加到 onload 事件处理程序。相反，您将 window.onload 的值设置为 loadDoc() 的返回值 - 这意味着 loadDoc() 正在运行，计算返回值；但它会在遇到时立即运行，而不是在应该调用 onload 时运行。
我假设添加 HttpRequest 延迟了函数足够长的时间，以便在正确的时间运行，而简单的代码在应该运行之前就已经运行了。
要正确附加事件，请使用
window.onload = (event) => { loadDoc(); };
参见https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event供引用
示例:在加载 myBanner 之前立即运行 loadDoc，导致 Uncaught TypeError: Cannot set property 'innerHTML' of null
<script>
window.onload = loadDoc();
function loadDoc() {
var mesage = "Hello World"
document.getElementById("myBanner").innerHTML=mesage;
return;
}
</script>
<body>
<div id="myBanner"></div>
</body>事件处理程序已正确附加，loadDoc 在加载所有元素后运行:
<script>
window.onload = (event) => { loadDoc(); }
function loadDoc() {
var mesage = "Hello World"
document.getElementById("myBanner").innerHTML=mesage;
return;
}
</script>
<body>
<div id="myBanner"></div>
</body>关于javascript - 为什么 window.onload 仅在某些时候被调用进行刷新？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60181791/