私はこのトピックの利用可能なリンクを読みましたが、助けにはなりませんでした。JavaScriptがHTMLファイルで動作していません
私は次のコードを実行しようとしています。 "menu.html"は別のページのdivに "world.html"をロードし、HTMLは表示されますが、JavaScriptは表示されません。
私はJSを別のファイルに持っていましたが、実行していないときには "world.html"に移動しましたが、問題は解決しませんでした。私もjQueryを参照しようとしました。
これはmenu.htmlです:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="layout.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="contact.js"></script>
<script src="preparePage.js"></script>
</head>
<body>
<a id="infoButton" class="infoButton" href="info.html"></a>
<a id="bodyButton" class="bodyButton" href="body.html"></a>
<a id="enterButton" class="enterButton" onclick="preparePage(); return false;"></a>
<a id="leaveButton" class="leaveButton" href="leave.html"></a>
<a id="contactButton" class="contactButton" onclick="contact(); return false;"></a>
</body>
<footer>
</footer>
</html>
とメニューを取り除くと負荷がworld.htmlますpreparePage.js、:
function preparePage() {
document.getElementById("box").style.backgroundImage = "none";
$("#infoButton").fadeOut("slow");
$("#bodyButton").fadeOut("slow");
$("#leaveButton").fadeOut("slow");
$("#contactButton").fadeOut("slow");
$("#box").load("world.html", function enter() {
$("#enterButton").fadeOut("slow");
});
}
そして最後にではなく、少なくとも、world.html :
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function wut() {
window.alert("owo");
}
</script>
</head>
<body onload="wut(); return false;">
mhfkhgfhtfjhfjj<br><br>
<canvas id="gameBox" width="1000" height="500" style="background-color:#ffffff;"></canvas>
</body>
<footer>
</footer>
</html>
EDIT:またmenu.htmlするdiv要素を含むページでlaunchpad.html、およびworld.htm含みますL負荷:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="layout.css">
<link rel="stylesheet" type="text/css" href="menu.css">
</head>
<body onload="openGame(); return false;">
<div id="cloud"></div>
<div id="box" class="box"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="openGame.js"></script>
</body>
<footer>
</footer>
</html>
そしてopenGame.js、#boxの形状を変更し、負荷がmenu.html:
別にあなたが持つ要素を持っていないという明白な事実からfunction openGame() {
$("#cloud").fadeOut("fast");
$("#box").animate({
height: '750px',
width: '1700px',
top: '100px',
left: '100px',
padding: '0px'
});
$("#box").load("menu.html");
document.getElementById("box").style.backgroundImage = "url('Images/menuBackground.png')";
}
いや、運:P – Nienaber
あなたにid 'box'を持つ要素を持っていません。 – trincot
コードの '#box'要素がありません。 –