Jqueryサイトの基本的なonSelect仕様に従って、次のコードを試しました。
<!DOCTYPE html>
<html>
<head>
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.datepicker.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#datepicker").datepicker();
$('#datepicker').datepicker({
onSelect: function(dateText, inst) { alert("Working"); }
});
});
</script>
</head>
<body style="font-size:62.5%;">
<div type="text" id="datepicker"></div>
</body>
</html>
そしてそれを機能させることができません!もともとはもっと複雑なことを機能させることを試みていましたが、onSelectが機能していなかったので、基本に戻ってまだ機能しません。
その行のすぐ上にある2番目の$("#datepicker").datepicker()
を削除してみてください。
$(document).ready(function(){
$('#datepicker').datepicker({ onSelect: function(dateText, inst) { alert("Working"); } });
});
APIを正しく使用していません。最初から混乱を招きます。
これらの行はどちらも、要素の日付ピッカーを初期化するように日付ピッカーウィジェットに指示しています。
$("#datepicker").datepicker();
$('#datepicker').datepicker({
onSelect: function(dateText, inst) { alert("Working"); }
});
最初の1つを削除しても、2番目の1つが何の影響も与えないようにする以外は何もしません。
ウィジェットを初期化した後で、オプションの1つの値を変更する場合は、このAPIを使用する必要があります。
$('#datepicker').datepicker('option', 'onSelect', function() { /* do stuff */ });
または、jQueryのbind
関数を使用してハンドラーをアタッチすることもできます。
$('#datepicker').bind('onSelect', function() { /* do stuff */ });
日付を選択するときにこのコードが機能する必要があります:
$("#datepicker").datepicker({
dateFormat: 'dd/mm/yy'
}).on("changeDate", function (e) {
alert("Working");
});
jQuery datepickerのonSelectが機能しない場合がありますが、onchange
タイプのinput
イベントのメソッドを呼び出すだけでバイパスできます。
_function changeDate() {
$("#datepicker").datepicker(
"change",
{
alert("I am working!!");
}
);
}
_
これをchangeDate()
メソッドとして呼び出す
_<div type="text" id="datepicker" onchange ="javascript:changeDate();" />
_