如何在javascript中显示我的测验结果

时间:2013-12-25 06:19:10

标签: javascript

我正在为我的小弟弟创建一个名为Mystery Date的测验。如何获取结果按钮以显示结果?按下按钮时没有任何反应。谢谢!

HTML:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
<html>
    <head>
        <link rel="stylesheet" href="style.css" />
    </head>
<script type='text/javascript' src='script.js'></script>
<title>Mystery Date</title>
</head>
<body>
  <div>
    <h1> Mystery Date </h1>  
  </div>
<!--<script>
var userName=prompt("What is your name?");
alert("Welcome to MYSTERY DATE" + " " + userName +"!");
</script> -->
  <div id="1"> 
    1. True of False: You prefer an athletic girl over a crafty girl. <br>
  <input type="radio" name="1" value="True" id="Brooke">True <br>
        <input type="radio" name="1" value="False" id="Evelyn">False <br>
  </div>

  <div id="2">
  2. True or False: You prefer a blonde over a brunette. <br>
  <input type="radio" name="2" value="True" id="Brooke">True <br>
        <input type="radio" name="2" value="False" id="Evelyn">False <br>
  </div>

  <div id="3">
  3. True or False: You would prefer a movie date to walking on the beach. <br>
  <input type="radio" name="3" value="True" id="Brooke">True <br>
        <input type="radio" name="3" value="False" id="Evelyn">False <br>
  </div>

  <div id="4">
  4. True or False: You prefer an outgoing girl over a sensitive girl. <br>
  <input type="radio" name="4" value="True" id="Brooke">True <br>
        <input type="radio" name="4" value="False" id="Evelyn">False <br>
  </div>

  <div id="3">
  5. True or False: You like brown eyes better than blue eyes. <br>
  <input type="radio" name="5" value="True" id="Brooke">True <br>
        <input type="radio" name="5" value="False" id="Evelyn">False <br>
  </div>

  <button onclick="results">Click Me For Results!</button>

</body>
</html>

CSS:

body {
background-color:black;
}
h1 {
    font-family:Verdana;
}

div {
  border:1px solid black;
  border-radius:8px;
  background-color:pink;
  padding:8px;
  opacity:.75;
}

js :(我无法将javascript和html放在一起,但是当我按下结果按钮时,结果函数应该会发生。我想我完全搞砸了这一部分)

/*var userName=prompt("What is your name?");
alert("Welcome to MYSTERY DATE" + " " + userName +"!"); */

$(document).ready(function() {
    $('body').mouseenter(function() {
    $('body').fadeTo('fast', 1);
    });
    $('body').mouseleave(function() {
    $('body').fadeTo('fast', 0.75);
    });
});
function results() {
    if($("#Brooke") >$("#Evelyn")) {
        alert("Your mystery date is....Brooke!");
    } else if($('#Brooke') === $('#Evelyn')) {
        alert("You would be perfect with Brooke or Evelyn!");
    } else {
        alert("Your mystery date is...Evelyn!");
    }
}

1 个答案:

答案 0 :(得分:0)

更改此行

<button onclick="results">Click Me For Results!</button>

用这个

<button onclick="results();">Click Me For Results!</button>

你没有正确地调用功能。