初心者ですTT jQueryを使ったカレンダーのことについて教えて下さい。
jQueryを使ったカレンダーを途中まで作ることができましたが、
なかなか思うように完成させることができませんでしたTT
作りたいと思っているのは、年がテキストボックスで、
月と日がセレクトで入力するようなものにしたいと思っています。
年月日をそれぞれ入力して、「表示ボタン」をクリックすると、
カレンダーが表示されるところまで作ることはできましたが、
表示されたカレンダーの日付をクリックした時に、年のテキストボックスへ
年が入り、月と日のセレクトに反映されるというようにしたいんですが、
思うように作ることができませんでした。
どなたか教えていただけませんでしょうか・・・。
よろしくお願いします！
↓以下ソースです。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>カレンダーテスト</title>
<!--カレンダー用jQuery-->
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="ui.datepicker.js"></script>
<script type="text/javascript" src="ui.datepicker-ja.js"></script>
<link rel="stylesheet" href="jquery/themes/flora/flora.all.css" type="text/css" media="screen">
<script type="text/javascript">
window.onload = function () {
$('#ex1').datepicker({
beforeShow:function(tag) {
var y=parseInt($('#year').val());
var m=parseInt($('#month').val());
var d=parseInt($('#dayofmonth').val());
var dt=new Date(y,m-1,d);
if(!isNaN(dt)) return{ defaultDate:dt};
}
});
}
</script>
<!--カレンダー用jQuery-->
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<!--カレンダーテスト-->
<input id="ex1" type="hidden" size="20" value="today" />
<input id="year" type="text" size="4" />年
<select name="month" id="month">
<option value="" ></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>月
<select name="dayofmonth" id="dayofmonth" >
<option value="" ></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>日
<button onclick="$('#ex1').datepicker('show');">表示</button>
<!--カレンダーテスト-->
</td></tr></table>
</body>
</html>
お礼
お忙しいなか、ご回答をいただきまして、 ありがとうございました。 ビット演算というものを目にしたのは初めてだったため、 とても勉強になりました。 勉強を疎かにせず、日々取り組んで行きたいと思います。