如何在JavaScript页面上重新加载页面后保持数据持久性？

我正在努力学习如何编写cookie以保持CookieButton1按钮中的数据持久性并保持刷新和页面重新加载。我怎样才能在JavaScript中做到这一点？我提供了我的源代码。任何建议，链接或教程将非常有帮助。如果您导航到[http://iqlusion.net/test.html][1]并点击Empty1，它会开始问你问题。完成后，它将所有内容存储到CookieButton1中。但是，当我刷新我的浏览器数据重置并消失。如何在JavaScript页面上重新加载页面后保持数据持久性？

谢谢！

<html> 
<head> 
<title>no_cookies> 
</head> 

<script type="text/javascript" > 

    function setCookie(c_name,value,expiredays) 

{ 
var exdate=new Date(); 
exdate.setDate(exdate.getDate()+expiredays); 
document.cookie=c_name+ "=" +escape(value)+ 
((expiredays==null) ? "" : ";expires="+exdate.toUTCString()); 
} 

    function getCookie(c_name) 

{ 
if (document.cookie.length>0) 
    { 
    c_start=document.cookie.indexOf(c_name + "="); 
    if (c_start!=-1) 
    { 
    c_start=c_start + c_name.length+1; 
    c_end=document.cookie.indexOf(";",c_start); 
    if (c_end==-1) c_end=document.cookie.length; 
    return unescape(document.cookie.substring(c_start,c_end)); 
    } 
    } 
return ""; 
} 

    function checkCookie() 

{ 
CookieButton1=getCookie('CookieButton1'); 
if (CookieButton1!=null && CookieButton1!="") 
    { 
    alert('Welcome again '+CookieButton1+'!'); 
    } 
else 
    { 

    if (CookieButton1!=null && CookieButton1!="") 
    { 
    setCookie('CookieButton1',CookieButton1,365); 
    } 
    } 
} 

var Can1Set = "false"; 

function Can1() 
{ 
    if (Can1Set == "false") 
    { 
     Can1Title = prompt("What do you want to name this new canned response?",""); 
     Can1State = prompt("Enter a ticket state (open or closed)","closed"); 
     Can1Response = prompt("Enter the canned response:",""); 
     Can1Points = prompt("What point percentage do you want to assign? (0-10)","2.5"); 

     // Set the "Empty 1" button text to the new name the user specified 
     document.CookieTest.CookieButton1.value = Can1Title; 

     // Set the cookie here, and then set the Can1Set variable to true 
     document.cookie = "CookieButton1"; 
     alert(document.cookie); 

     Can1Set = true; 
    }else{ 
     document.TestForm.TestStateDropDownBox.value = Can1State; 
     document.TestForm.TestPointsDropDownBox.value = Can1Points; 
     document.TestForm.TestTextArea.value = Can1Response; 

     // document.TestForm.submit(); 

    } 
} 
</script> 

<form name=TestForm> 
State: <select name=TestStateDropDownBox> 
<option value=new selected>New</option> 
<option value=open selected>Open</option> 
<option value=closed>Closed</option> 

</select> 

Points: <select name=TestPointsDropDownBox> 
<option value=1>1</option> 
<option value=1.5>1.5</option> 
<option value=2>2</option> 
<option value=2.5>2.5</option> 
<option value=3>3</option> 
<option value=3.5>3.5</option> 
<option value=4>4</option> 
<option value=4.5>4.5</option> 
<option value=5>5</option> 
<option value=5.5>5.5</option> 
<option value=6>6</option> 
<option value=6.5>6.5</option> 
<option value=7>7</option> 
<option value=7.5>7.5</option> 
<option value=8>8</option> 
<option value=8.5>8.5</option> 
<option value=9>9</option> 
<option value=9.5>9.5</option> 
<option value=10>10</option> 
</select> 
<p> 

Ticket information:<br> 
<textarea name=TestTextArea cols=50 rows=7></textarea> 
</form> 

<form name=CookieTest> 

<input type=button name=CookieButton1 value="Empty 1" onClick="javascript:Can1()"> 

</form>

来源

2010-06-08 Johhny Thero

你有任何服务器端代码的语言？ – 2010-06-08 22:23:46

现在不行。我在其他项目上使用.php脚本。我搜索谷歌JavaScript的cookie，并找到多个工作的例子。问题是我无法将它们集成到此代码中。我迄今为止所做的一切似乎都行不通。 – 2010-06-08 22:32:52

// Set the cookie here, and then set the Can1Set variable to true 
document.CookieTest.CookieButton1 = "CookieButton1";

你是不是在这里设置cookie。您试图将名称为CookieTest的名称为CookieButton1的按钮元素更改为字符串值"CookieButton1"。这会在平均浏览器中显示JavaScript错误。

要设置一个真正的cookie，你需要document.cookie。你可以在w3schools找到一个小教程。

来源

2010-06-08 22:34:43 BalusC

看看你现在提供的两个链接。感谢您提醒我注意。 – 2010-06-08 22:39:25

我检查了您提供的链接。我遵循教程，仍然无法为我的表单写入Cookie。我写了三个函数function setCookie，函数getCookie和函数checkCookie（）。我还更新了上面的源代码输出。不知道我做错了什么。 – 2010-06-08 23:15:34

document.cookie =“CookieButton1”;

所做的就是设置一个没有值的cookie，只有一个名字。 Cookie被定义为'名称=值'配对。

它应该是这样的（或等同物）的document.cookie = 'Cookie编号= CookieButton1';

设置了document.cookie =不会覆盖现有的cookie，只需追加信息既定的cookie。

如果你想删除由您的域名设置你总是可以使用下面的脚本

function delCookie() { 
    var new_date = new Date() 
    new_date = new_date.toGMTString() 
    var thecookie = document.cookie.split(";") 
    for (var i = 0; i < thecookie.length; i++) { 
     document.cookie = thecookie[i] + "; expires =" + new_date 
    } 
}

如果需要单独删除cookies，您有就足够了removeCookie功能所有Cookie，但只有当它是在名称=值配对中。否则，您的Cookie不可用，因为它不包含任何数据只是名称。

来源

2010-06-09 08:42:23 Akidi

你的cookie值工作尽可能保存数据是，然而，一旦你点击刷新can1set变量被设置回false所以当它运行checkCookie()功能的浏览器把它看作null的价值。在我目前工作的聊天程序中，我有一个类似的问题，直到我在我的checkCookie()函数中设置一个变量来检查。这样我并不总是检查false价值和返回null我的if语句。

是这样的...

function checkCookie() 
{ 
var username=getCookie("username"); 
if (username!=null && username!="") 
    { 
    //if username is NOT null and is not blank asigns it to idname 
    document.getElementById("idname").innerHTML= document.getElementById("idname").innerHTML += username; 
    } 
else 
    { 
    //if username IS null or blank prompt user to enter name 
    username=prompt("Please enter your name:",""); 
    if (username!=null && username!="") 
    { 
    setCookie("username",username,1); 
    } 
    else 
    { 
    //if user submits a null or blank value close browser 
    byebye(); 
    } 
    } 
}

来源

2014-03-07 02:33:09 SubZero

如何在JavaScript页面上重新加载页面后保持数据持久性？

回答

相关问题