Question

您好我已经听说过我遇到过的问题的不同解决方案，我将解释我想做什么以及我正在做什么。我正在进行一项“反应测试”，当你看到一个图形弹出B或R时，基本上你要做的就是按下两个按钮。所以问题是我不知何故需要发送哪个键被压到“结果文件”而没有在测试期间显示用户。我听说你可以用cookies做，你可以使用隐藏的输入类型并将其发送到下一页，你可以使用document.write，createelement或只使用GET和POST方法。所以我的问题是我应该怎么做，哪种方式，如果我能得到一些代码的帮助，我不会哭。我知道HTML，CSS，jQuery和JavaScript，我不想要任何PHP解决方案。这是三页，所以你可以知道它的样子，前两个几乎是不同的颜色和形状，所以我只会使用其中一个页面。

输入隐藏的test.html ||输入隐藏测试1.html：

<!DOCTYPE html>
<html>
<head>
<title>Input hidden test</title>
<style>
#first-child {
   width: 200px;
   height: 200px;
   background: white;
   border-radius: 0%;
   margin-top: 150px;
   margin-bottom: 50px;
   margin-left: 550px;
   margin-right: 0px;
  -webkit-animation: myfirst 1s;
  -moz-animation: myfirst 1s;
  animation: myfirst 1s;
}
@-webkit-keyframes myfirst {
        0% {background: white;}
       20% {background: white;}
       40% {background: white;}
       60% {background: white;}
       80% {background: white;}
      100% {background: red;}
}
@keyframes myfirst {
        0% {background: white;}
       20% {background: white;}
       40% {background: white;}
       60% {background: white;}
       80% {background: white;}
      100% {background: red;}
}
#first-parent {
   color: blue;
   margin-top: 5px;
   margin-bottom: 50px;
   margin-left: 600px;
   margin-right: 0px;
}
#second-parent {
   color: red;
   margin-top: 0px;
   margin-bottom: 50px;
   margin-left: 40px;
   margin-right: 0px;
}
p {
   margin-left: 640px;
}
</style>
</head>
<body>

<div id="first-child"></div>

<button id="first-parent" onclick="">B</button>
<button id="second-parent" onclick="">R</button>
<br />
<p>1/2</p>
<script>
document.onkeypress = function(e) {
   e = e || window.event;
   var charCode = e.charCode || e.keyCode,
       character = String.fromCharCode(charCode);

   console.log(charCode);
   window.location.href="Input hidden test 1.html";
};
</script>
</html>

输入隐藏测试2.html：

<!DOCTYPE html>
<html>
<head>
<title>Input hidden test 2</title>
<style>

</style>
</head>
<body>

<script>

</script>
</html>

这或多或少，如果有任何问题请问，和平！

Answer 1

您问题的最终答案

<强> Test1.html

<!DOCTYPE html>
<html>
<head>
<title>Input hidden test</title>
</head>
<body>

<div>
    <h1>1. Who is the president of America?</h1><br/>
    A) Bush <br />
    B) Obama <br />
    C) Clinton <br />
    D) yourself .
</div>

<p>1/2</p>



<script>
document.onkeypress = function(e) {
    e = e || window.event;
   var charCode = e.charCode || e.keyCode,
       character = String.fromCharCode(charCode);
    var answer;
       if((e.keyCode>64 && e.keyCode<69)||(e.keyCode>96 && e.keyCode<101) ){
       if(e.keyCode==65 || e.keyCode==97){
            answer='A';
       } else if(e.keyCode==66|| e.keyCode==98){
            answer='B';
       }else if(e.keyCode==67|| e.keyCode==99){
            answer='C';
       }else if(e.keyCode==68|| e.keyCode==100){
            answer='D';
       }
       localStorage.setItem("keypressed","");
            localStorage.setItem("keypressed","<h1>1. Who is the president of America?</h1><br /> your Answer :" +answer +"<br />Correct Answer :  B<br />");
            window.location.href="test1.html";
            return true;
       }
       else{
            alert("press A or B or C or D");
            return false;
       }

};
</script>
</html>

<强> Test2.html

<!DOCTYPE html>
<html>
<head>
<title>Input hidden test</title>

</head>
<body>

<div id="first-child"></div>

<button id="first-parent" onclick="">B</button>
<button id="second-parent" onclick="">R</button>
<br />

<div>
    2. Who is the princess of Sweden?
    A) mary <br />
    B) jones <br />
    C) You <br />
    D) Someone .
</div>

<p>2/2</p>



<script>
document.onkeypress = function(e) {
    e = e || window.event;
   var charCode = e.charCode || e.keyCode,
       character = String.fromCharCode(charCode);
    var answer;
       if((e.keyCode>64 && e.keyCode<69)||(e.keyCode>96 && e.keyCode<101) ){
       if(e.keyCode==65 || e.keyCode==97){
            answer='A';
       } else if(e.keyCode==66|| e.keyCode==98){
            answer='B';
       }else if(e.keyCode==67|| e.keyCode==99){
            answer='C';
       }else if(e.keyCode==68|| e.keyCode==100){
            answer='D';
       }
      var res= localStorage.getItem("keypressed");
      res+="<h1>2. Who is the princess of Sweden?</h1><br /> your Answer :" +answer +"<br />Correct Answer :  C <br />";
            localStorage.setItem("keypressed",res);
            window.location.href="result.html";
            return true;
       }
       else{
            alert("press A or B or C or D");
            return false;
       }

};
</script>
</html>

<强> RESULT.HTML

<!DOCTYPE html>
<html>
<head>
<title>Input hidden test 2</title>
<style>

</style>
</head>
<body>
<div id="result"></div>
<script>
var result= localStorage.getItem("keypressed");
document.getElementById('result').innerHTML= result;
//alert(result);
</script></html>

Answer 2

在test1.html中

<script>
document.onkeypress = function(e) {
   e = e || window.event;
   var charCode = e.charCode || e.keyCode,
       character = String.fromCharCode(charCode);

   console.log(charCode);
    localStorage.setItem("keypressed",charCode);// adding keypressed
   window.location.href="Input hidden test 1.html";
};
</script>

<强> test2.html

<!DOCTYPE html>
<html>
<head>
<title>Input hidden test 2</title>
<style>

</style>
</head>
<body>
<div id="result"></div>
<script>
var result= localStorage.getItem("keypressed");
document.getElementById('result').innerHTML= result;
//alert(result);
</script></html>

Answer 3

我会使用本地存储空间。这很容易，您只需要将第一个文件中的测量时间写为localStorage.setItem("measuredTime",measuredTime+"")（您只能在本地存储中放置字符串）。第一个参数是标识符，第二个参数是值。要检索第二个文件中的值，您必须使用localStorage.getItem("measuredTime")。该值可以从整个域中获取。您最多可以存储5MB

此外，我认为您需要衡量用户按下按钮所需的时间。可能最简单的方法是使用somevariable = new Date().getTime()，因为它返回从unix时代（1970年1月1日）开始的毫秒数。您可以在显示数字时使用此功能一次，然后在用户按下按钮时使用第二次。两个数字之间的差异是反应时间。

此外，random()函数和setTimeout()对于随机显示数据非常有用。

发送关键方法

3 个答案: