Appendix JS_N_A4
Summary
Requirement: Changes of context are only initiated by user request or with user control.
Details: Do not use the change event of a SELECT element for navigation.
Examples
Incorrect code
Refer to the JS_N_A4 live demo for a working example.
<form action="#"> <fieldset> <legend> <strong>Weather and Warnings in your area</strong> </legend> <select id="demo"> <option value="">Select your area:</option> <option value="nsw">New South Wales</option> <option value="vic">Victoria</option> <option value="qld">Queensland</option> <option value="wa">Western Australia</option> <option value="sa">South Australia</option> <option value="tas">Tasmania</option> <option value="act">Australian Capital Territory</option> <option value="nt">Northern Territory</option> </select> </fieldset> </form>
var select = document.getElementById('demo'); select.addEventListener('change', function() { var value = select.options[select.options.selectedIndex].value; if(value !== '') { document.location.href = 'http://www.bom.gov.au/' + value + '/'; } }, false);