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'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'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'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'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'ts of the IT security?",
\t \t \t \t \t \t \t \t "Don't be trick in giving sensitive data away",
\t \t \t \t \t \t \t \t "Don'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>