带jQuery的隐藏/关闭按钮

Question

我创建了一个应该在点击时删除的div框。会有一个小的“X”图像，当你点击它时，该框消失。应该没有选项可以再次显示。理想情况下，我想以某种方式将信息保存到cookie中，以便它不会出现在页面刷新或查看其他页面时（它将在站点范围内实施）。

这里是我的简单示例代码：

http://jsfiddle.net/2gNrC/

Answer 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(); 
    } 
    } 

}）;

Answer 2

我相信你是在谈论一个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"); 
         } 
        } 

       ] 
    }); 

Answer 3

这是一个使用localStorage的解决方案 - 我把它作为一个练习，读者可切换到使用cookie：

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