javascript - HTML <select> JQuery .change not working -
alright don't see why isnt working. seems pretty simple.
here drop-down menu:
<div> <form> <select id='yeardropdown'> <c:foreach var="years" items="${parkyears}"> <option value=/events.html?display_year=${years}<c:if test="${currentyear == years}">selected="selected"</c:if>>${years}</option> </c:foreach> </select> </form> </div> and here javascript
$("#yeardropdown").change(function () { alert('the option value ' + $(this).val()); }); right want working can add functionality. thanks!
that code syntactically correct. running @ wrong time.
you'll want bind event when dom ready:
$(function(){ /* dom ready */ $("#yeardropdown").change(function() { alert('the option value ' + $(this).val()); }); }); or, use live:
$("#yeardropdown").live('change', function() { alert('the option value ' + $(this).val()); }); or, use delegate:
$(document.body).delegate('#yeardropdown', 'change', function() { alert('the option value ' + $(this).val()); }); or, if you're using jquery 1.7+:
$("#yeardropdown").on('change', function() { alert('the option value ' + $(this).val()); }); nonetheless, best execute script once browser has finished rendering markup.
Comments
Post a Comment