Javascript - Dependent Option Link

SUBMITTED BY: Guest

DATE: July 19, 2013, 3:29 p.m.

FORMAT: JavaScript

SIZE: 1.9 kB

Raw Download

HITS: 1547

Report
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <title></title>
  5. <script>
  6. function makeLink() {
  7. var color = document.getElementById("typefield").value;
  8. var shape = document.getElementById("stylefield").value;
  9. if (color != "" && shape != "") {
  10. switch (color + shape) {
  11. case "BlueSquare":
  12. window.location = "http://google.com"
  13. break;
  14. case "BlueCircle":
  15. window.location = "http://facebook.com"
  16. break;
  17. case "BlueTriangle":
  18. //etc.
  19. break;
  20. }
  21. }
  22. }
  23. </script>
  24. </head>
  25. <body>
  26. <fieldset>
  27. <legend>Colour/Shape</legend>
  28. <label for="typefield">Colour: </label>
  29. <select id="typefield" name="typefield" onchange="makeLink();">
  30. <option selected value=""> </option>
  31. <option value="Blue">Blue</option>
  32. <option value="Red">Red</option>
  33. <option value="Green">Green</option>
  34. <option value="Brown">Brown</option>
  35. </select>
  37. <label for="stylefield">Shape: </label>
  38. <select id="stylefield" name="stylefield" onchange="makeLink();">
  39. <option selected value=""> </option>
  40. <option value="Square">Square</option>
  41. <option value="Circle">Circle</option>
  42. <option value="Triangle">Triangle</option>
  43. <option value="Rectangle">Rectangle</option>
  44. </select>
  45. </fieldset>
  46. </body>
  47. </html>
comments powered by Disqus