jQuery的效果基本show和引導的警報（顯示僅一次）

所以我創建了一個說是我的網站會使用Cookie在我的網站留言：jQuery的效果基本show和引導的警報（顯示僅一次）

Cookie Popup

創建了下面的代碼：

<div id="cookies" class="container text-center"> 
    <h3>This site is using cookies. 
     <a id="hide" class="btn btn-info">Ok! No problem.</a>  
    </h3> 
</div>

所以我想，當有人按下按鈕的消息滑動使用jQuery。使用此代碼：

<script> 
$("#hide").click(function() { 
    $("#cookies").slideUp(1000); 
}) 

$("#show").click(function() { 
    $("#cookies").slideDown(1000); 
}) 
</script>

但由於某種原因，沒有任何事情發生。這是我第一次使用jquery。

另外：

如果有人知道它，是有可能顯示此消息每個IP地址只是一個時間？點擊按鈕後它不會顯示出來？

感謝您提前回答！

來源

2014-03-01 MrBlackDrag0nfly

恕我直言，不添加信息的那種..無人問津。 2014年和每個網站正在使用Cookie .. – Hardy

嘗試在你的JS周圍添加[ready handler]（http://api.jquery.com/ready/）。 – Adrift

你錯過了事件函數的分號，你添加了jQuery庫嗎？你把你的腳本放在文檔準備好的功能中嗎？ – sourRaspberri

您正在嘗試slideUp一個元素（#cookies），該元素看起來不在您發佈的HTML代碼段中。你確定它在嗎？

如果您希望僅爲每個IP顯示一次郵件，您可以將其作爲explained存儲在cookie中。

您可以通過JavaScript獲得IP，如this。

更新

「難道是因爲我的頭和導航（其中消息是從部分）都是獨立的PHP文件，我包括到index.php中？」 - 否，文件在將它們提供給客戶端/瀏覽器之前，將它們合併在一起。

您正試圖在加載jQuery之前執行腳本。如果你檢查你的控制檯，你會看到這個錯誤Uncaught ReferenceError: $ is not defined。 jQuery將$定義爲jQuery的快捷方式，因爲它尚未加載，所以它尚未定義並導致腳本出錯。

把你的腳本放在jQuery包含在頁面底部。在關閉body標籤之前，將所有腳本放在頁面底部（如Google Analytics代碼段）總是一個好習慣。這可以確保您的HTML和CSS呈現並且不會被任何JavaScript阻止。

你可以換你腳本ready處理器中，以確保它沒有得到執行前整頁都準備好了，這樣的：

$(document).ready(function() { 
    $("#hide").click(function() { 
     $("#cookies").slideUp(1000); 
    }); // don't forget the semicolon here 

    $("#show").click(function() { 
     $("#cookies").slideDown(1000); 
    }); // don't forget the semicolon here 
});

另外別忘了打開body後您關閉head並關閉頁面底部的body和html標記。

您可能還想看看HTML5 Boilerplate瞭解更多最佳實踐。

來源

2014-03-01 13:22:12

我很抱歉，糾正了代碼就是現在。 – MrBlackDrag0nfly

你的代碼似乎在這[JSFiddle]（http://jsfiddle.net/xeY3H/1/） –

工作是否可以是因爲我的頭和導航（消息是從哪裏來的）都是單獨的php文件，我包括到index.php中？（這裏是網站，如果你想看看：http：//mrblackdragonfly.com） – MrBlackDrag0nfly

您可以通過管理的jQuery插件cookie，當你在瀏覽器中加載頁面，查看cookie信息，如果箱子已經加載那裏，如果yes然後只需hide()功能隱藏。

Cookie的jQuery插件：

的JavaScript

$(function() { 
    var status = $.cookie('the_cookie'); 
    if (status == "hide") { 
     $('#cookies').hide(); 
     console.log('the box hided on the IP'); 
    } else { 

    } 

    $('#hide').click(function() { 
     $('#cookies').slideUp(1000, function() { 
      $.cookie('the_cookie', 'hide', { expires: 30, path: '/' }); 
     }); 
    }); 
});

JSFiddle demo

來源

2014-03-02 04:02:04 Girish

小提琴在Chrome瀏覽器中被阻止，這是一個跨源問題。 –

jQuery的效果基本show和引導的警報（顯示僅一次）

回答

相關問題