admin管理员组文章数量:1026989
In the script at the bottom I get the result from /php/get/items-sold.php and put it into the div called items-list. It's not supposed to actually go to the page /php/get/item-sold.php, but on the FIRST load of my site it does - or it goes to the banner php file or the sidebar php file which are loaded in sidebar.js. But on subsequent loads it works entirely like it's supposed to.
I just tried putting the code that loads it in an event listener for DOMContentLoaded, as you can see in my code below, but it fixed nothing.
What could be causing this and how can I fix it?
<!DOCTYPE HTML>
<html>
<head>
<title>Crochet Store</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="/assets/css/main.css" />
</head>
<body class="is-preload">
<script>
// to eliminate Flash Of Unstyled Content
const loadingOverlay = document.createElement("div");
loadingOverlay.id = "loading-overlay";
loadingOverlay.innerHTML = "<div class='lds-ring'><div></div><div></div><div></div><div></div></div>";
document.getElementsByTagName("body")[0].prepend(loadingOverlay);
</script>
<!-- Wrapper -->
<div id="wrapper">
<!-- Main -->
<div id="main">
<div class="inner">
<!-- Header -->
<!-- sidebar.js will fill this -->
<header id="header"><p id="js-disabled-warning">You have javascript disabled... the site needs javascript to function. Please enable javascript :(</p></header>
<!-- Banner -->
<!-- sidebar.js will fill this -->
<section id="banner"></section>
<!-- Section -->
<section>
<header class="major">
<h2>Items I Sell:</h2>
</header>
<div id="items-list"></div>
</section>
</div>
</div>
<!-- sidebar.js will fill this -->
<div id="sidebar"></div>
</div>
<!-- Scripts -->
<script src="/assets/js/jquery.min.js"></script>
<script src="/assets/js/sidebar.js"></script>
<script src="/assets/js/util.js"></script>
<script src="/assets/js/main.js"></script>
<script>
function resizeBannerImg() {
const width = document.getElementById("banner-img").clientWidth;
$("banner-img").attr("height", width);
}
window.addEventListener("DOMContentLoaded", function() {
xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const response = this.responseText;
$("#items-list").html(response);
};
xmlhttp.open("GET", "/php/get/items-sold.php");
xmlhttp.send();
});
</script>
</body>
</html>
In the script at the bottom I get the result from /php/get/items-sold.php and put it into the div called items-list. It's not supposed to actually go to the page /php/get/item-sold.php, but on the FIRST load of my site it does - or it goes to the banner php file or the sidebar php file which are loaded in sidebar.js. But on subsequent loads it works entirely like it's supposed to.
I just tried putting the code that loads it in an event listener for DOMContentLoaded, as you can see in my code below, but it fixed nothing.
What could be causing this and how can I fix it?
<!DOCTYPE HTML>
<html>
<head>
<title>Crochet Store</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="/assets/css/main.css" />
</head>
<body class="is-preload">
<script>
// to eliminate Flash Of Unstyled Content
const loadingOverlay = document.createElement("div");
loadingOverlay.id = "loading-overlay";
loadingOverlay.innerHTML = "<div class='lds-ring'><div></div><div></div><div></div><div></div></div>";
document.getElementsByTagName("body")[0].prepend(loadingOverlay);
</script>
<!-- Wrapper -->
<div id="wrapper">
<!-- Main -->
<div id="main">
<div class="inner">
<!-- Header -->
<!-- sidebar.js will fill this -->
<header id="header"><p id="js-disabled-warning">You have javascript disabled... the site needs javascript to function. Please enable javascript :(</p></header>
<!-- Banner -->
<!-- sidebar.js will fill this -->
<section id="banner"></section>
<!-- Section -->
<section>
<header class="major">
<h2>Items I Sell:</h2>
</header>
<div id="items-list"></div>
</section>
</div>
</div>
<!-- sidebar.js will fill this -->
<div id="sidebar"></div>
</div>
<!-- Scripts -->
<script src="/assets/js/jquery.min.js"></script>
<script src="/assets/js/sidebar.js"></script>
<script src="/assets/js/util.js"></script>
<script src="/assets/js/main.js"></script>
<script>
function resizeBannerImg() {
const width = document.getElementById("banner-img").clientWidth;
$("banner-img").attr("height", width);
}
window.addEventListener("DOMContentLoaded", function() {
xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
const response = this.responseText;
$("#items-list").html(response);
};
xmlhttp.open("GET", "/php/get/items-sold.php");
xmlhttp.send();
});
</script>
</body>
</html>
本文标签：
版权声明：本文标题：javascript - On the first load of my site, why does it redirect the the page I access with XMLHttpRequest? - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745655015a2161545.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论