​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
  
11
  // Wait for user to click the button
12
  e.addEventListener( "change", function() {
13
  
14
    // Do the conditional statement
15
    var msg = (this.color.value == "Blue") ? "Just like the sky!" : "Didn't select blue huh?";
16
    
17
    // Output the result
18
    document.getElementById("msg").innerHTML = msg;
19
  
20
  }, false);
21
});
22
</script>
23
​
24
<!-- Replace '{action page}' with your own action page to support non-JavaScript users -->
25
<form id="myForm" name="myForm" action="{action page}">
26
  <label>
27
    <input type="radio" name="color" value="Blue"> Blue
28
  </label>
29
  <label>
30
    <input type="radio" name="color" value="Red"> Red
31
  </label>
32
  <label>
33
    <input type="radio" name="color" value="Green"> Green
34
  </label>
35
</form>
36
​
37
<p id="msg"></p>