​x
 
1
<!DOCTYPE html>
2
<title>My Example</title>
3
​
4
<script>
5
// Wait for DOM to load
6
document.addEventListener("DOMContentLoaded", function(event) {
7
​
8
  // Put the button into a variable
9
  var e = document.getElementById("myForm");
10
  var msg = "";
11
  
12
  // Wait for user to click the button
13
  e.addEventListener( "change", function() {
14
  
15
    // Put the selected value into a variable
16
    var myColor = this.color.value;
17
    
18
    // The "If Else" statement.
19
    if (myColor == "Blue") {
20
    
21
      msg = "Just like the sky!";
22
      
23
    }
24
    
25
    else {
26
​
27
      msg = "Didn't pick blue huh?";
28
      
29
    }
30
    
31
    // Output message
32
    document.getElementById("msg").innerHTML = msg;
33
    
34
  }, false);
35
});
36
</script>
37
​
38
<!-- Replace '{action page}' with your own action page to support non-JavaScript users -->
39
<form id="myForm" name="myForm" action="{action page}">
40
  <label>
41
    <input type="radio" name="color" value="Blue"> Blue
42
  </label>
43
  <label>
44
    <input type="radio" name="color" value="Red"> Red
45
  </label>
46
  <label>
47
    <input type="radio" name="color" value="Green"> Green
48
  </label>
49
</form>
50
​
51
<p id="msg"></p>