无法理解为什么我不能按名称阅读java cookies

时间:2014-01-27 20:51:49

标签: javascript cookies

好吧,我已经用这个把头发拉了好几个小时了,现在我已经完全秃了我正在扯着毛巾看看是否有人可以指出(我很确定很简单)的错误正在把我的代码变成无用的垃圾。

我有两个页面,第一个用户输入3个输入,然后将它们保存为cookie:

    <script type="text/javascript">
     function CC()
      {
        var V1Box = document.getElementById("V1");
        var V2Box = document.getElementById("V2");
        var V3Box = document.getElementById("V3");
        var V1 = V1Box.value;
        var V2 = V2Box.value;
        var V3 = V3Box.value;

           document.cookie = "V1 = " + V1 + "; path=/";
           document.cookie = "V2 = " + V2 + "; path=/";
           document.cookie = "V3 = " + V3 + "; path=/";

        window.location = "pg2.html";
      }

</script>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="Generator" content="Serif WebPlus X5">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
<title>db2</title>
<style type="text/css">
body {margin: 0px; padding: 0px;}
.Artistic-Body-C
{
    font-family:"Verdana", sans-serif; font-size:27.0px; line-height:1.19em;
}
</style>
<link rel="stylesheet" href="wpscripts/wpstyles.css" type="text/css">
</head>
<body text="#000000" style="background-color:#ffffff; text-align:center; height:900px;">
<div style="background-color:transparent;text-align:left;margin-left:auto;margin
right:auto;position:relative;width:375px;height:900px;">
<form id="form_1" action="" method="post" target="_self" style="margin:0px;">
<input type="button" style="position:absolute; left:271px; top:12px; width:81px;
height:22px;" value="Submit" onClick="CC()">
<input type="text" id="V1" name="V1" value="" style="position:absolute; left:23px;
top:12px; width:227px;">
<input type="text" id="V2" name="V2" value="" style="position:absolute; left:23px;
top:46px; width:227px;">
<input type="text" id="V3" name="V3" value="" style="position:absolute; left:23px;
top:80px; width:227px;">
</form>
</div>
</body>
</html>

第二页应该获取先前设置的cookie并隔离其值:

<script type="text/javascript">

window.onload = function getCookie(){

var allcookies = document.cookie;
   cookiearray  = allcookies.split(';');

   for(var i=0; i < cookiearray.length; i++){
      var name = cookiearray[i].split('=')[0];
      var value = cookiearray[i].split('=')[1];
        if(name == 'V1'){var V1 = value;}
        if(name == 'V2'){var V2 = value;}
        if(name == 'V3'){var V3 = value;}
   }

document.getElementById("V1").innerHTML += V2;
document.getElementById("V2").innerHTML += V1;
document.getElementById("V3").innerHTML += V3;
}

</script>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="Generator" content="Serif WebPlus X5">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
<title>db2</title>
<style type="text/css">
body {margin: 0px; padding: 0px;}
.Artistic-Body-C
{
    font-family:"Verdana", sans-serif; font-size:27.0px; line-height:1.19em;
}
</style>
<link rel="stylesheet" href="wpscripts/wpstyles.css" type="text/css">
</head>
<body text="#000000" style="background-color:#ffffff; text-align:center; height:900px;">
<div style="background-color:transparent;text-align:left;margin-left:auto;margin
right:auto;position:relative;width:375px;height:900px;">
<div style="position:absolute;left:23px;top:12px;">
    <div class="Wp-Artistic-Body-P">
        <span class="Artistic-Body-C" id="V1">V1: </span></br>
        <span class="Artistic-Body-C" id="V2">V2: </span></br>
        <span class="Artistic-Body-C" id="V3">V3: </span></br></div>
</div>
</div>
</body>
</html>

我遇到的问题是代码无法识别这些if语句中的任何名称 - 即使我回显了名称和值;它将回显“V3”和相应的值,但V3变量从未设置,并将回显为“未定义”。我正在试图弄清楚它如何将名称设置为“V3”,但后来不能识别“if(name =='V3'){var V3 = value)”并保持var V3未定义。我甚至测试了“if(name!='V3'){var V3 = value)”,即使在回显名称并获得“V3”时,它也会在if语句中解释不等于V3的名称并实际设置相应的V3变量值。我不明白它如何正确地命名一切,正确检索所有内容,然后在if语句中不识别名称来正确设置变量 - 如果我调用V1或V2或V3无关紧要;它只是没有在if语句中看到这些名称。

我确信这在我的语法中是愚蠢的,或者有一个错字或其他东西,但经过三个小时的尝试自己解决之后,我显然对此视而不见。我认识到还有其他更简单的方法来操纵用户输入,但我的项目整体要求我使用cookie,并且我能够在不同页面上按名称检索它们;如果您对如何以更好的方式完成此标准有任何建议,我将非常感激,但只是让我当前的代码正常工作将是一个很大的帮助和我的头皮(我继续抓住任何剩余的一缕头发开始大量出血了)非常感谢你。

2 个答案:

答案 0 :(得分:0)

查看声明V1,V2,V3的位置!

    if(name == 'V1'){var V1 = value;}   <-- what happens if not true
    if(name == 'V2'){var V2 = value;}   <-- what happens if not true
    if(name == 'V3'){var V3 = value;}   <-- what happens if not true

他们不会被定义。

你需要

var v1 = "";
var v2 = "";
var v3 = "";

声明并将var放在ifs中。

JSLint / JSHint会指出这个错误。


第三个问题是innerHTML不能有+ =

document.getElementById("V1").innerHTML = document.getElementById("V1").innerHTML + V1;

其他问题是名称中的空格。饼干后面有空格;您没有在名称中考虑到这一点。

答案 1 :(得分:-1)

<script type="text/javascript">


function getCookie(){

var allcookies = document.cookie;
   cookiearray  = allcookies.split(';');

   for(var i=0; i < cookiearray.length; i++){
      var name = cookiearray[i].split('=')[0];
      var value = cookiearray[i].split('=')[1];
        if(name == 'V1'){var V1 = value;}
        if(name == 'V2'){var V2 = value;}
        if(name == 'V3'){var V3 = value;}
   }

document.getElementById("V1").innerHTML += V2;
document.getElementById("V2").innerHTML += V1;
document.getElementById("V3").innerHTML += V3;
}

window.onload = getCookie; 
</script>

我不相信getCookie函数曾经运行过。