2回目以降のページロード時には、実行しないようにし

質問

こちらのサイトの

http://black-flag.net/jquery/20100526-1094.html

中段より少し下にある、『ページロード時にモーダルウィンドウを立ち上げるタイプ』

サンプルページ
http://black-flag.net/devel/jQueryPageloadModal/index02.html

というのを使いたいのですが、
2回目以降のページロード時には、実行しないようにしたいのですが、
具体的にどのようにすればいいでしょうか？

もし可能であれば、2回目以降ではなく、ブラウザを切るまでは実行しない、
または、訪問して1時間以内は実行しない、というふうにできればと思っています。

どうぞよろしくお願いいたします。

回答No.2

yyr446 · ベストアンサー

jQueryのCookieプラグイン「jquery.cookie.js」
http://plugins.jquery.com/project/Cookie
使って、↓のようにすれば出来るけど、モーダルウィンドウ内でOK、NGの
判定はしてないよ。つまり、そこからYahooに飛んで戻ってきても、
あなたのページは訪問したことになってるよ。
　※全角空白は半角空白にしてね。
<script type="text/javascript">
$(function(){

　if($.cookie("check")===null){
　 var now = new Date();
　 now.setTime(now.getTime()+ 3600 * 1000); //1時間(3600秒)後
　 $.cookie("check","ok",{expires:now});

　 $('html').css({overflow:'hidden'});
　 if(document.getElementById("MDL_overlay") === null){
　　 $('body').append('<div id="MDL_overlay"></div>');
　　 if($.browser.msie && $.browser.version < 7){
　　　$('body','html').css({height: '100%', width: '100%'});
　　　$('#MDL_overlay').css('position','absolute');
　　　$('#MDL_overlay').css('top',$(document).scrollTop());
　　 }
　 }
　 if(document.getElementById("MDL_window") === null){
　　 $('body').append(
　　　'<div id="MDL_window">' +
　　　'<h2>ページ認証BOX</h2>' +
　　　'<p>年齢認証などで使用するページロード時に開くBOXサンプル。</p>' +
　　　'<p>「OK」ボタンをクリックで枠を閉じる。<br />' +
　　　'「CANCEL」ボタンをクリックでYahooサイトへリンク。</p>' +
　　　'<div class="md_btn">' +
　　　'<a href="javascript:void(0);" id="md_ok">OK</a><a href="http://www.yahoo.co.jp/" id="md_cancel">CANCEL</a>' +
　　　'</div>' +
　　　'</div>'
　　 );
　　 if($.browser.msie && $.browser.version < 7){
　　　$('#MDL_window').css('position','absolute');
　　　$('#MDL_window').css('top',($(document).scrollTop() + $(window).height()/2) + "px");
　　 }
　 }
　 $('#MDL_overlay').show();
　 $('#MDL_window').fadeIn('slow');
　 $('#md_ok').click(function () {
　　 MDL_eliminate();
　 });
　}
});
function MDL_eliminate() {
　$('html').css({overflow:''});
　$('#MDL_overlay').fadeOut('fast');
　$('#MDL_window').fadeOut('fast');
　if($.browser.msie && $.browser.version < 7){
　 $("body","html").css({height: "auto", width: "auto"});
　};
　setTimeout(MDL_remove,500);
}

function MDL_remove() {
　$('#MDL_overlay').remove();
　$('#MDL_window').remove();
}
</script>
</head>

お礼

できました！
どうもありがとうございました！

回答No.1

LOHA

coockieを使いましょう。

＞ブラウザを切るまでは実行しない
expires値を無指定

＞訪問して1時間以内は実行しない
expires値を設定

coockieをチェックして、存在するならスクリプトは実行しない、存在しないならスクリプトを実行してcookieを書き込む(書きこみがあることが確認出来ればよいので設定する値は何でも良いでしょう)といったようにすればよいかと思います。。

参考URL：

http://www.tohoho-web.com/wwwcook.htm

補足

LOHAさんへ

どうもありがとうございます。
expires値を無指定というのをしたいのですが、下のソースの最後のほうに

if (document.cookie) {expires=Thu, 01-Jan-1970 00:00:00 GMT}

のような感じで記述すればいいのでしょうか？検索してみましたが、よく分かりませんでした・・。
できましたら、具体的に教えていただけないでしょうか。
どうぞよろしくお願いいたします。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function () {
$('html').css({overflow:'hidden'});
if(document.getElementById("MDL_overlay") === null){
$('body').append('<div id="MDL_overlay"></div>');
if($.browser.msie && $.browser.version < 7){
$('body','html').css({height: '100%', width: '100%'});
$('#MDL_overlay').css('position','absolute');
$('#MDL_overlay').css('top',$(document).scrollTop());
}
}
if(document.getElementById("MDL_window") === null){
$('body').append(
'<div id="MDL_window">' +
'<h2>ページ認証BOX</h2>' +
'<p>年齢認証などで使用するページロード時に開くBOXサンプル。</p>' +
'<p>「OK」ボタンをクリックで枠を閉じる。<br />' +
'「CANCEL」ボタンをクリックでYahooサイトへリンク。</p>' +
'<div class="md_btn">' +
'<a href="javascript:void(0);" id="md_ok">OK</a><a href="http://www.yahoo.co.jp/" id="md_cancel">CANCEL</a>' +
'</div>' +
'</div>'
);
if($.browser.msie && $.browser.version < 7){
$('#MDL_window').css('position','absolute');
$('#MDL_window').css('top',($(document).scrollTop() + $(window).height()/2) + "px");
}
}
$('#MDL_overlay').show();
$('#MDL_window').fadeIn('slow');
$('#md_ok').click(function () {
MDL_eliminate();
});
return false;
});

function MDL_eliminate() {
$('html').css({overflow:''});
$('#MDL_overlay').fadeOut('fast');
$('#MDL_window').fadeOut('fast');
if($.browser.msie && $.browser.version < 7){
$("body","html").css({height: "auto", width: "auto"});
};
setTimeout('MDL_remove()',500);
}
function MDL_remove() {
$('#MDL_overlay').remove();
$('#MDL_window').remove();
}
</script>