2011-11-03 105 views
0

我創建了一個應該在點擊時刪除的div框。會有一個小的「X」圖像,當你點擊它時,該框消失。應該沒有選項可以再次顯示。理想情況下,我想以某種方式將信息保存到cookie中,以便它不會出現在頁面刷新或查看其他頁面時(它將在站點範圍內實施)。帶jQuery的隱藏/關閉按鈕

這裏是我的簡單示例代碼:

http://jsfiddle.net/2gNrC/

回答

1

快速和骯髒的:(http://jsfiddle.net/bambitlaw/RsS5V /)

$(document).ready(function(){ 
$('#closebutton').click(function(){ 
    $('#box').hide(); 
    $(this).hide(); 
    document.cookie="hideit=yes"; 
});  
var i,x,y,ARRcookies=document.cookie.split(";"); 
for (i=0;i<ARRcookies.length;i++) 
{ 
    x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("=")); 
    y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1); 
    x=x.replace(/^\s+|\s+$/g,""); 
    if (x=="hideit") 
    { 
    $('#box').hide(); 
    $('#closebutton').hide(); 
    } 
    } 

});

+0

我用這個,只用「刪除」替換「隱藏」,以避免顯示:在CSS中沒有。 – tommie111

0

我相信你是在談論一個jQuery對話框。我通常使用「X」字符本身,它看起來不錯。樣本如下。

$('#yourdiv').dialog({ 
     closeOnEscape: true, 
     draggable: true, 
     modal: true, 
     closeText: 'X', 
     width: 500, 
     title: 'Your Title', 
     buttons: [ 
        { 
         text: "Save", 
         click: function() { 
          $(this).dialog("close"); 
         } 
        }, 
        { 
         text: "Cancel", 
         click: function() { 
          $(this).dialog("close"); 
         } 
        } 

       ] 
    }); 
3

這是一個使用localStorage的解決方案 - 我把它作爲一個練習,讀者可切換到使用cookie:

http://jsfiddle.net/aTKs5/7/

+0

謝謝,這個作品在JSfiddle中很棒!我會盡力實施它並讓你知道。 – tommie111

+0

聯機時不起作用。我是否正確包裝?腳本在頭部使用以下代碼: tommie111

+0

我已經更新了小提琴,以便在'$(document).ready()'中包裝所有東西,就像我從一開始就應該做的那樣 - 抱歉! – Benjie