2016-04-26 67 views
0

我是HTML中的新手& JS我想將兩個表格鏈接在一起。就像計時器到達0時一樣,分數會自動更新,問題將以新的問題開始,問題將不再重複。如何將表格鏈接在一起

<!DOCTYPE HTML> 
 
<HTML> 
 
<HEAD> 
 
<meta http-equiv="refresh" content="6"> 
 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
 
<script> 
 
function shuffleArray(array) { 
 
\t \t for (var i = array.length - 1; i > 0; i--) { 
 
\t \t \t var j = Math.floor(Math.random() * (i + 1)); 
 
\t \t \t var temp = array[i]; 
 
\t \t \t array[i] = array[j]; 
 
\t \t \t array[j] = temp; 
 
\t \t } 
 
\t \t return array; \t 
 
\t } 
 

 
console.log ('DEBUG shuffleArray()') 
 

 
</script> 
 

 
<style type="text/css"> 
 
    table, 
 
    td.col2 {width:70%} 
 
    td.col1 {width:30%} 
 
\t table, th , td{ 
 
\t \t border: 1px solid black; 
 
\t \t border-collapse: collapse; 
 
\t } 
 
\t th, td { 
 
\t \t padding: 150px; 
 
\t } 
 
\t 
 
</style> 
 
</HEAD> 
 
<body onload="setTimeout('nextPic()',2000)"> 
 
\t 
 
\t <table align="center" > 
 
\t \t <tr> 
 
\t \t \t <td class="col1"> 
 
\t \t \t 
 
\t \t \t <script type="text/JavaScript"> 
 
\t \t \t <!-- 
 
\t \t \t var picCount=0; // global 
 
\t \t \t var picArray= ["image/5.png","image/4.png","image/3.png","image/2.png","image/1.png"] 
 
\t \t \t // 
 
\t \t \t // gets next picture in array 
 
\t \t \t \t function nextPic() 
 
\t \t \t \t \t \t { // check if adding 1 exceeds number of pics in array 
 
\t \t \t \t \t \t picCount=(picCount+1<picArray.length)? picCount+1 : 0; 
 
\t \t \t \t \t \t // build the img to write to page using the new pic reference 
 
\t \t \t \t \t \t var build='<img border="0" src="'+picArray[picCount]+'" width="205" height="100">\ 
 
\t \t \t \t \t \t '; 
 
\t \t \t \t document.getElementById("imgHolder").innerHTML=build; 
 
\t \t \t \t // repeat this after a puse of 2000ms (2sec). 
 
\t \t \t \t setTimeout('nextPic()',1000) 
 
\t \t \t \t } 
 
\t \t \t \t //--> 
 
\t \t \t </script> 
 
\t \t \t \t 
 
\t \t 
 
\t \t \t <div id="imgHolder"> 
 
\t \t \t \t <img border="0" src="image/5.png" width="205" height="100"> 
 
\t \t \t </div> 
 
\t \t 
 
\t \t \t </td> 
 
\t \t \t <td class="col2" id="demo" align="left" > 
 
\t \t \t 
 
\t \t \t <script> 
 
\t \t \t \t var point = 25; 
 
\t \t \t \t var pos = 0, test, test_status, question, choice, choices, chA, chB, chC, chD, correct = 0; 
 
\t \t \t \t var questions = [ 
 
\t \t \t \t \t [ "Which of the following is not a rule of thumb for password?", 
 
\t \t \t \t \t \t \t \t "Follow the strong password references ", 
 
\t \t \t \t \t \t \t \t "Use personal reference like birthday,name and home address", 
 
\t \t \t \t \t \t \t \t "Don&#39;t disclose any of your password to anyone ", \t \t \t \t 
 
\t \t \t \t \t \t \t \t "Do not use any words found in the dictionary", 
 
\t \t \t \t \t \t \t \t "B" ], 
 
\t \t \t \t \t [ "Which is not a way to prevent you from being social engineered? ", 
 
\t \t \t \t \t \t \t \t "Be wary of emails, instant messages and phone calls", 
 
\t \t \t \t \t \t \t \t "Pay attention to website URL", 
 
\t \t \t \t \t \t \t \t "Give personal inforamtion to others", 
 
\t \t \t \t \t \t \t \t "Never download email attachment from unknown senders", 
 
\t \t \t \t \t \t \t \t "C" ], 
 
\t \t \t \t \t [ "What makes a good password?", 
 
\t \t \t \t \t \t \t \t "At least 8 characters", 
 
\t \t \t \t \t \t \t \t "Contain Numbers and Symbols", 
 
\t \t \t \t \t \t \t \t "Contain both upper and lower case", 
 
\t \t \t \t \t \t \t \t "All the above", 
 
\t \t \t \t \t \t \t \t "D" ], 
 
\t \t \t \t \t [ "What should you do if you receive an email attachment from someone you don&#39;t know?", 
 
\t \t \t \t \t \t \t \t "Do not open the attachment.", 
 
\t \t \t \t \t \t \t \t "Open the attachment if the subject line seems appropriate.", 
 
\t \t \t \t \t \t \t \t "Reply to the email and request more information.", 
 
\t \t \t \t \t \t \t \t "Open the attachment if your virus software doesn't alert you not to.", 
 
\t \t \t \t \t \t \t \t "A" ], 
 
\t \t \t \t \t ["Which one of these ways is not a way to prevent spams from email?", 
 
\t \t \t \t \t \t \t \t "Prevention", 
 
\t \t \t \t \t \t \t \t "Use Firewall", 
 
\t \t \t \t \t \t \t \t "Use Filters", 
 
\t \t \t \t \t \t \t \t "Report Spammers", 
 
\t \t \t \t \t \t \t \t "B"], 
 
\t \t \t \t \t \t ["Which of the following is not a rule of thumb for password?", 
 
\t \t \t \t \t \t \t \t "Follow the strong password references ", 
 
\t \t \t \t \t \t \t \t "Use personal reference like birthday,name and home address", 
 
\t \t \t \t \t \t \t \t "Don&#39;t disclose any of your password to anyone ", \t \t \t \t 
 
\t \t \t \t \t \t \t \t "Do not use any words found in the dictionary", 
 
\t \t \t \t \t \t \t \t "B"], 
 
\t \t \t \t \t ["Are all the ways to prevent identity theft?", 
 
\t \t \t \t \t \t \t \t "Strengthen Password", 
 
\t \t \t \t \t \t \t \t "Don&#39;t give out personal information if it is necessary", 
 
\t \t \t \t \t \t \t \t "Shred all your letter before throwing it again", 
 
\t \t \t \t \t \t \t \t "All the above", 
 
\t \t \t \t \t \t \t \t "D"], 
 
\t \t \t \t \t ["Are all these the don&#39;ts of the IT security?", 
 
\t \t \t \t \t \t \t \t "Don&#39;t be trick in giving sensitive data away", 
 
\t \t \t \t \t \t \t \t "Don&#39;t leave sensitive info lying around", 
 
\t \t \t \t \t \t \t \t "Be cautious of all suspicious email and websites", \t \t \t \t 
 
\t \t \t \t \t \t \t \t "All the above", 
 
\t \t \t \t \t \t \t \t "D"], 
 
\t \t \t \t \t ["What are the ways to protect you on social media?", 
 
\t \t \t \t \t \t \t \t "Use a strong password", 
 
\t \t \t \t \t \t \t \t "Be cautious on social media like email or social media message", 
 
\t \t \t \t \t \t \t \t "Know what you are sharing", \t \t \t \t 
 
\t \t \t \t \t \t \t \t "All the above", 
 
\t \t \t \t \t \t \t \t "D"], 
 
\t \t \t \t \t ["Which of these are not the pre-cautions when you use the free Wi-Fi at public places like cafe and airports?", 
 
\t \t \t \t \t \t \t \t "Enable firewall", 
 
\t \t \t \t \t \t \t \t "Turn on Sharing", 
 
\t \t \t \t \t \t \t \t "Turn off Wi-Fi when not using", \t \t \t \t 
 
\t \t \t \t \t \t \t \t "Use HTTPS and SSL whenever is possible ", 
 
\t \t \t \t \t \t \t \t "B"] 
 
\t \t \t \t ]; 
 
\t \t \t \t function _(x){ 
 
\t \t \t \t \t return document.getElementById(x); 
 
\t \t \t \t } 
 
\t \t \t \t function renderQuestion(){ 
 
\t \t \t \t \t test = _("test"); 
 
\t \t \t \t \t if(pos >= questions.length){ 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t \t _("test_status").innerHTML = "Test Completed"; 
 
\t \t \t \t \t \t pos = 0; 
 
\t \t \t \t \t \t ScorePlus = 0; 
 
\t \t \t \t \t \t ScoreMinus = 0; 
 
\t \t \t \t \t \t return false; 
 
\t \t \t \t \t } 
 
\t \t \t \t \t 
 
\t \t \t \t \t question = questions[pos][0]; 
 
\t \t \t \t \t chA = questions[pos][1]; 
 
\t \t \t \t \t chB = questions[pos][2]; 
 
\t \t \t \t \t chC = questions[pos][3]; 
 
\t \t \t \t \t chD = questions[pos][4]; 
 
\t \t \t \t \t 
 
\t \t \t \t \t test.innerHTML = "<h3>"+question+"</h3>"; 
 
\t \t \t \t \t test.innerHTML += "<input type='radio' name='choices' value='A'> "+chA+"<br>"; 
 
\t \t \t \t \t test.innerHTML += "<input type='radio' name='choices' value='B'> "+chB+"<br>"; 
 
\t \t \t \t \t test.innerHTML += "<input type='radio' name='choices' value='C'> "+chC+"<br>"; 
 
\t \t \t \t \t test.innerHTML += "<input type='radio' name='choices' value='D'> "+chD+"<br><br>"; 
 
\t \t \t \t \t test.innerHTML += "<button onclick='checkAnswer()'>Submit Answer</button>"; 
 
\t \t \t \t } 
 
\t \t \t \t function checkAnswer(){ 
 
\t \t \t \t \t choices = document.getElementsByName("choices"); 
 
\t \t \t \t \t for(var i=0; i<choices.length; i++){ 
 
\t \t \t \t \t \t if(choices[i].checked){ 
 
\t \t \t \t \t \t \t choice = choices[i].value; 
 
\t \t \t \t \t \t } 
 
\t \t \t \t \t } 
 
\t \t \t \t \t if(choice == questions[pos][5]){ 
 
\t \t \t \t \t \t ScorePlus++; \t 
 
\t \t \t \t \t \t //point++; \t 
 
\t \t \t \t \t \t \t \t \t \t \t 
 
\t \t \t \t \t } 
 
\t \t \t \t \t else if(choice != questions[pos][5]){ 
 
\t \t \t \t \t \t ScoreMinus--; 
 
\t \t \t \t \t \t //point--; 
 
\t \t \t \t \t } 
 
\t \t \t \t \t pos++; 
 
\t \t \t \t \t renderQuestion(); 
 
\t \t \t \t 
 
\t \t \t \t } 
 
\t \t \t \t window.addEventListener("load", renderQuestion, false); 
 

 

 
\t \t \t \t \t 
 
\t \t \t \t \t 
 
\t \t \t \t \t shuffleArray (questions); \t //Shuffle the whole allQuestions array \t 
 
\t \t \t \t \t \t 
 

 
\t \t \t \t \t 
 
\t \t \t </script> 
 
\t \t \t \t \t <h2 id="test_status"></h2> 
 
\t \t \t \t \t <div id="test"></div> 
 
\t \t \t </td> 
 
\t \t </tr> 
 
\t </table> 
 

 

 
</BODY> 
 
</HTML>

回答

0

不能使用HTML刷新。

<meta http-equiv="refresh" content="6"> 

由於每6秒鐘頁面重新加載並且所有事情重新開始。 您必須以與更換圖像相同的方式進行,而不是刷新。