2017-08-24 67 views
1

我目前正在试验一些代码。我的任务是在点击一个按钮时让网站的一部分发生变化。用一个按钮单击更改网站的一部分

这是HTML代码;

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>index</title> 
 
<link href="style.css" rel="stylesheet" type="text/css"> 
 
<script type="text/javascript" src="script.js"></script> 
 
<script type="text/javascript" src="jquery-3.2.1.min.js"></script> 
 
</head> 
 

 
<body> 
 
<div class="webside"> 
 
\t 
 
<div class="header"> 
 
<p class="headerfont">ElevValgomat</p> 
 
</div> 
 

 
<div class="upperBody"> 
 
<div class="question"> 
 

 
<p id="sporsmaal">Dette er et spørsmål.</p> 
 

 

 
<div class="uenig"></div> 
 
<div class="littUenig"></div> 
 
<div class="vetIkke"></div> 
 
<div class="littenig"></div> 
 
<div class="enig"></div> 
 

 
<p id="forklaring">Uenig</p> 
 
<p id="forklaring">Vet ikke</p> 
 
<p id="forklaring">Enig</p> 
 

 
<button onClick="question()">Neste</button> 
 
\t 
 
</div> 
 
</div> 
 

 
<div class="lowerBody"> 
 
<div class="faktaboks"> 
 
\t 
 

 
<div class="eo"></div> 
 
<p id="temaHeaderRegular">Mer om</p><p id="temaHeaderBold">&nbsp;temaet</p> 
 
<p id="tema"> Dette er en faktasetning om temaet vi skal ha spørsmål om. trykk her for å asdfg hei jeg heter sondre osv osv osv osv hei hei hei.</p> 
 

 

 
</div> 
 
</div> 
 

 
</div> 
 

 
</body> 
 
</html>

这里是JavaScript是在不同的文档。

function question() { 
"use strict"; 
$(document).ready(function()) { 
    $("#question2").click(function()) { 
     $("#question").load("question2.html"); 
    } 
} 

}

所以这些链接和我的意图是使JavaScript的运行另一个HTML文档,这将填补我的容器。

回答

1

你b uttons没有ID “问题2”,所以你的onclick事件永远不会触发

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>index</title> 
 
<link href="style.css" rel="stylesheet" type="text/css"> 
 
<script type="text/javascript" src="script.js"></script> 
 
<script type="text/javascript" src="jquery-3.2.1.min.js"></script> 
 
</head> 
 

 
<body> 
 
<div class="webside"> 
 
\t 
 
<div class="header"> 
 
<p class="headerfont">ElevValgomat</p> 
 
</div> 
 

 
<div class="upperBody"> 
 
<div class="question"> 
 

 
<p id="sporsmaal">Dette er et spørsmål.</p> 
 

 

 
<div class="uenig"></div> 
 
<div class="littUenig"></div> 
 
<div class="vetIkke"></div> 
 
<div class="littenig"></div> 
 
<div class="enig"></div> 
 

 
<p id="forklaring">Uenig</p> 
 
<p id="forklaring">Vet ikke</p> 
 
<p id="forklaring">Enig</p> 
 

 
<button id="question2">Neste</button> 
 
\t 
 
</div> 
 
</div> 
 

 
<div class="lowerBody"> 
 
<div class="faktaboks"> 
 
\t 
 

 
<div class="eo"></div> 
 
<p id="temaHeaderRegular">Mer om</p><p id="temaHeaderBold">&nbsp;temaet</p> 
 
<p id="tema"> Dette er en faktasetning om temaet vi skal ha spørsmål om. trykk her for å asdfg hei jeg heter sondre osv osv osv osv hei hei hei.</p> 
 

 

 
</div> 
 
</div> 
 

 
</div> 
 

 
</body> 
 
</html>

"use strict"; 
    $(document).ready(function()) { 
     $("#question2").click(function()) { 
      $("#question").load("question2.html"); 
     } 
    }