2017-02-15 9 views
0

ユーザーがページ上のクッキーを受け入れると、クッキーを保存しています.... これを実行すると、訪問時にポップアップが表示されなくなります。JavaScriptでクッキーを読む際にエラーが発生する

私はbody onloadの読み込みCookieスクリプトを呼び出すときに何もしません。

クッキーが設定されているように、クッキーが設定されています。

私はこれを実行しようとしている方法は、別の関数を呼び出し、変数

マイcookieornot()コードとしてリターンを格納cookieornot(と呼ばれる外部の.js内の1つの関数)を呼び出しているです:

function cookieornot(){ 
    var result = readCookie("acceptcookies"); 
    if (result) { 
     document.getElementById('acceptcookies').style.display = 'none'; 
    } else { 
     document.getElementById('acceptcookies').style.display = 'block'; 
    } 
    } 

マイreadcookie()のコードは、私が

として両方の機能の参照を保持している外部の.jsファイルを持っている私のHTMLファイルに

function readCookie(name) { 
    var nameEQ = name + "="; 
    var ca = document.cookie.split(';'); 
    for(var i=0;i < ca.length;i++) { 
    var c = ca[i]; 
    while (c.charAt(0)==' ') c = c.substring(1,c.length); 
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
    } 
    return null; 
} 

です

<script src="assets/js/ordersys.js"></script> 

私のHTML部分がある:(DIV ID =クッキーが設定されている場合、 "acceptCookiesは" 非表示にする必要があります)

<body onload='cookieornot()'> <a href="#" class="scrollToTop w3-btn fa fa-chevron-circle-up fa-2x"> 
    </a> 
    <!-- Modal --> 
    <nav class="w3-sidenav w3-white w3-card-8 w3-animate-left w3-center" style="display:none;z-index:4;width:70px" 

     id="mySidenav"> </nav> 
    <!-- Overlay --> 
    <div id="id02" class="w3-modal"> </div> 
    <div id="id01" class="w3-modal"> </div> 
    <div id="id03" class="w3-modal"> </div> 
    <!-- Begin Code Here --> 
    <div id="Header"></div> 
    <div id="acceptCookies" class="w3-panel w3-blue w3-card-12" style="position:fixed;bottom:0px;right:0px;width:100%;"> 
     <span onclick="this.parentElement.style.display='none'" class="w3-closebtn">&times;</span> 
     <h3>This Site Uses Cookies</h3> 
     <p>We use cookies to help improve the function of this site. <a href=cookies.html>Learn More</a></p> 
     <button class="w3-btn w3-round-xxlarge" onclick="acceptCookies()">I Accept Cookies</button><br><br> 
    </div> 

だから反復するために、クッキーが正しく設定されている

名前: コンテンツをacceptcookies:真 ドメイン:.XXXXX.XXXX パス:/ のために送る:スクリプトへのアクセス可能な接続 の任意の種類を:はい 作成:2017年2月14日(火曜日) t 5:30:47 PM 有効期限:2018年2月14日(水曜日)午後5時30分47秒

しかし、acceptcookiesクッキーが設定されている場合、期待どおりこのコードはdivを隠すことを何もしません。

は、私は多分ボディのonloadからここに切り替えるでした:

<script type="text/javascript"> 
     $(document).ready(function() { 
     $('#mySidenav').load('assets/static_html/navbar_links.html'); 
     $('#Header').load('assets/static_html/header_on.html'); 
     $('#Footer').load('assets/static_html/footer.html'); 
     $('#id02').load('assets/static_html/email_modal.html'); 
     $('#id01').load('assets/static_html/phone_modal.html'); 

     $(window).scroll(function(){ 
      if ($(this).scrollTop() > 100) { 
      $('.scrollToTop').fadeIn(); 
      } else { 
      $('.scrollToTop').fadeOut(); 
      } 
     }); 
     //Click event to scroll to top 
     $('.scrollToTop').click(function(){ 
      $('html, body').animate({scrollTop : 0},800); 
      return false; 
     }); 
     }); 
    </script> 

ので、どのように私はそれをやって行くでしょうか? readCookieが、それはクッキーが見つからない場合は、それがnullを返しますので、あなたが

if(result) { 

if (result === "True") { 

からクッキーにこの行を変更したりできませんでし書かれている方法に基づいて

+0

「JavaScriptを使用してCookieを読み込む際にエラーが発生しました」 - エラーが何であるかを推測する必要がありますか? –

+0

'acceptcookies'は' acceptCookies'と同じではありません – dave

+0

この場合、クッキーデータはクライアントサイドでのみ必要なので、代わりにLocalStorageの使用を検討してください。 (https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)これにより、必要なデータが少なくて済み、サーバーからの応答がキャッシュ可能になる傾向があるため、HTTP要求が高速になります。クッキーよりも扱いが簡単です。 – Brad

答えて

1

。真の場合にのみ、クッキーが作成されます。お役に立てれば。

第2部 すでにjQuery.readyイベントがあるので、DOM全体がロードされた後にその関数を実行するために活用することができます。私はあなたのポストの一番下にあるjavascriptセグメントに関数呼び出しを追加しました。あなたは体の負荷からそれを削除する必要があります。

$(document).ready(function() { 
    $('#mySidenav').load('assets/static_html/navbar_links.html'); 
    $('#Header').load('assets/static_html/header_on.html'); 
    $('#Footer').load('assets/static_html/footer.html'); 
    $('#id02').load('assets/static_html/email_modal.html'); 
    $('#id01').load('assets/static_html/phone_modal.html'); 

    $(window).scroll(function(){ 
     if ($(this).scrollTop() > 100) { 
     $('.scrollToTop').fadeIn(); 
     } else { 
     $('.scrollToTop').fadeOut(); 
     } 
    }); 
    //Click event to scroll to top 
    $('.scrollToTop').click(function(){ 
     $('html, body').animate({scrollTop : 0},800); 
     return false; 
    }); 

    cookieornot(); // Function added here. 
    }); 
+0

それは問題を解決しませんでしたが、より短いコードですので、入力にはどうもありがとうございます –

+0

スクリプトにconsole.logsを追加しようとしましたか?あなたが期待するワークフローに従っているかどうか知っていますか? –

+0

コンソールログは、cookieornot()の3行目でnullのプロパティスタイルを設定できないことを示します。 –

0

私はその後、すべてが見て、正常に動作今、体の下部にあるタグに置き、外部JavaScriptからcookieornot()関数を削除する必要がありました。私はなぜこのようにしなければならなかったのか肯定的ではありません...

私はまだcookieornot()を呼び出していますが、今は動作します。

関連する問題