Presentation is loading. Please wait.

Presentation is loading. Please wait.

Drop-down box. Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object.

Similar presentations


Presentation on theme: "Drop-down box. Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object."— Presentation transcript:

1 Drop-down box

2 Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object of document The href property of location

3 HTML syntax option 1 option 2

4 Javascript properties To access the select element: document.form1.menu Properties of the element: length options (an array) options[n].value options[n].text selectedIndex Event-handlers: onchange / onfocus /onblur

5 Example Links Google Facebook

6 Example function go(){ var n = document.form1.links.selectedIndex; var url = document.form1.links.options[n].value; window.document.location.href = url; }

7 Assignment Modify the example by targeting the value of the options to the src attribute of an iframe. (5 points) The html code for the iframe is:


Download ppt "Drop-down box. Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object."

Similar presentations


Ads by Google