よく配布されているもの（下）をもう少し工夫したもので・・・
------------------
<script type="text/javascript">
xday = new Date (2010, 10, 10, 0, 0, 0);
now = new Date ();
diff = xday.getTime() - now.getTime();
days = Math.ceil(diff / (1000 * 60 * 60 * 24));
document.write("xdayまで、あと" + days + "日です。");
</script>
------------------
「xday」をユーザに任意に設定させて、
さらにクッキーに保存、
そして次回からユーザごとのカウントダウンを表示させたいのです。
構想としては、初期設定としてoncllick、かなんかで、
同じページ内の「表示箇所」にカウントダウンを表示。
次回からは、読み込まれると「表示箇所」に自動でカウントダウン表示されているという感じです。
説明が悪いようなら補足いたします、よろしくお願いします。
No.1
203
20
100pt
ちょっと適当な部分もあると思いますが。
41
38
<html>
<head>
<title>カウントダウンサンプル</title>
</head>
<body>
<p id="date"><!-- 表示部 --></p>
<p><input type="text" id="countdownDate" sie="10" style="display:none"
onkeypress="setCountdown(event)"
><input type="button" id="countdownEdit" value="カウントダウン設定" onclick="editMode(this)"></p>
<script type="text/javascript"><!-- /body 直前に -->
var dt = getCookie();
if(dt) {
document.getElementById('date').innerHTML = countdownMsg(dt);
}
function countdownMsg(dt){
var mdt=new Date(dt);
return mdt.getFullYear() + '/' + ( mdt.getMonth() + 1 ) + '/' + mdt.getDate() +
'まで' + diffDay(dt) + '日です。';
}
function getCookie(){
var ck = document.cookie;
if(! ck) return false;
return ( unescape(ck.split(/=/)[1]) );
}
function editMode(O){
var dtO = O.parentNode;
var ck = getCookie()||'YYYY/M/D';
var countdowndate = document.getElementById('countdownDate');
countdowndate.value=ck;
countdowndate.style.display='inline';
O.style.display='none';
countdowndate.focus();
}
function setCountdown(event){
if(event.keyCode != 13) return;
var dtO = document.getElementById('countdownDate');
var dt = dtO.value;
var exp=new Date(dt);
if(! exp.getTime()) {
alert('Error');
return;
}
exp.setDate(exp.getDate()+10); // ←ここでcookieの有効期限設定（設定日経過後？日）
document.getElementById('date').innerHTML = countdownMsg(dt);
dtO.style.display='none';
document.getElementById('countdownEdit').style.display='inline';
document.cookie = 'countdown=' + escape(dt) + '; expires=' + exp.toGMTString();
}
function diffDay(dt) {
var xday = new Date(dt);
if(! xday.getTime()) return 'Error';
var now = new Date();
var diff = xday.getTime() - now.getTime();
return Math.ceil(diff / (1000 * 60 * 60 * 24));
}
</script>
</body>
</html>
tontonpokopoko
2009/03/02 18:17:09
Mars
1
4
2
わざわざソースを丸ごと書いていただき大変恐縮です。
今から動作確認をしてみたいと思います。
本当にありがとうございました。