<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script type="text/javascript" src="MonthByValue.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<script type="text/javascript">
// uisng jQuery
$(document).ready(function(){
// provide the selector as a string
MonthByValueKeyDown.init("#months_1");
// This wont work proiving a selector that returns more than 1 element
//MonthByValueKeyDown.init(".monthSel");
// this will work using a class but only selects 1 element and using a selector object not string
//MonthByValueKeyDown.init($(".months"));
});
// using the dom without jQuery
/*document.addEventListener("DOMContentLoaded", function(){
MonthByValueKeyDown.init(document.getElementById("months_1"));
});*/
</script>
</head>
<body>
<select id="months_1" class="monthSel months">
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
<option value="4">Apr</option>
<option value="5">May</option>
<option value="6">Jun</option>
<option value="7">Jul</option>
<option value="8">Arg</option>
<option value="9">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>
<select id="months_2" class="monthSel">
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
<option value="4">Apr</option>
<option value="5">May</option>
<option value="6">Jun</option>
<option value="7">Jul</option>
<option value="8">Arg</option>
<option value="9">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>
</select>
</body>
</html>
|
Download
