我知道我需要在我的代码中添加一个window.open，但我的问题是我不确定它需要在哪里正常工作。我点击检查时打开一个新窗口。该窗口将显示结果。谢谢
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Math Worksheet</title>
<link href="styles.css" rel="stylesheet" type="text/css">
<script>
var variable = new Array();
var correct=0;
function setupEvents() { // Loads page
makeProblems();
}
function makeProblems() { // Creates variables for problems
var tempText;
for ( i=0; i < 20; i++) {
variable[i] = Math.floor(Math.random() * 50) + 1;
tempText = variable[i];
i++;
document.getElementById('var' + i).innerHTML = tempText;
i--;
}
}
function checkAnswers() { // checks the answers
var answer;
var sum;
var number1;
var number2;
var j=0;
var img=0;
for ( i=1; i <= 10; i++) {
answer = document.getElementById('answer' + i).value;
if ( checkInput(answer, i) == false ) { //Error-checking
return false;
}
number1 = variable[j];
j++
number2 = variable[j];
sum = number1 + number2;
j++;
if ( answer == sum ) {
document.images[img].src = "img/correct.gif";
correct++;
} else {
document.images[img].src = "img/wrong.gif";
}
//}
img++;
}
disableButton();
giveResults();
}
function checkInput(answer, i){
if( isNaN(answer) || answer == "" ) { // makes sure that the input is a number
for (j=0; j < 10; j++) {
document.images[j].src = "img/hide.png"; // image used to swap between corret and wrong images
}
window.alert("Please enter a number.");
document.getElementById('answer' + i).value = "";
document.getElementById('answer' + i).focus();
correct=0;
return false;
} else {
document.getElementById('answer' + i).setAttribute("class", "");
}
}
function disableButton() {
document.getElementById('buttons').innerHTML = "<input type='button' value=' More! ' onclick='moreProblems()' id='more' class='right' /><input type='button' value=' Check! ' onclick='checkAnswers()' id='check' class='right' disabled='disabled'/>";
}
function giveResults() {
// gives number of correct answers
if ( correct == 10 ) {
document.getElementById('correct').innerHTML = correct + " out of 10!<br />Way to Go! You are great at Math!";
} else {
document.getElementById('correct').innerHTML = correct + " out of 10!<br />Nice try! Let's give it another shot! I know you can do it!";
}
}
function moreProblems() { // reloads the page
window.document.location = "math.html";
}
window.onload = setupEvents;
</script>
</head>
<body>
<div id="container">
<div id="header"> </div>
<div id="header2"> </div>
<div id="worksheet">
<form action="">
<div id="main">
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var1">34</span><br>
+<span id="var2">8</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer1" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var3">4</span><br>
+<span id="var4">25</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer2" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var5">9</span><br>
+<span id="var6">26</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer3" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var7">28</span><br>
+<span id="var8">4</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer4" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var9">32</span><br>
+<span id="var10">24</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer5" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var11">46</span><br>
+<span id="var12">17</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer6" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var13">3</span><br>
+<span id="var14">48</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer7" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var15">43</span><br>
+<span id="var16">50</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="" id="answer8" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var17">9</span><br>
+<span id="var18">44</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer9" value="" class="">
</div>
<div class="problem">
<input class="carryOver" type="text" size="1" maxlength="1">
<img src="img/hide.png" alt="">
<p class="variables">
<span id="var19">18</span><br>
+<span id="var20">43</span>
</p>
<div class="line"> </div>
<hr>
<input type="text" size="3" maxlength="3" id="answer10" value="" class="">
</div>
</div>
<div id="footer">
<div class="left">Correct: <span id="correct"> </span></div>
<div id="buttons" class="right buttons">
<input type="button" value=" More! " onclick="moreProblems()" id="more" class="right">
<input type="button" value=" Check! " onclick="checkAnswers()" id="check" class="right">
</div>
</div>
</form>
</div>
<p></p>
</div>
</html>
答案 0 :(得分：1)
我假设您在新窗口中想要的结果是giveResults描述的那些。
您可以重写该功能以打开您想要显示的数据URI 。
function giveResults() { // gives number of correct answers
if (correct == 10) {
window.open('data:text/plain,' + encodeURIComponent(correct + " out of 10!\r\nWay to Go! You are great at Math!"));
} else {
window.open('data:text/plain,' + encodeURIComponent(correct + " out of 10!\r\nNice try! Let's give it another shot! I know you can do it!"));
}
}