将值从cookie存储到JavaScript变量

我刚刚开始使用JavaScript和jQuery，并且正在逐步解决问题，如果这是一个基本问题，我深表歉意。我编写了一些简单的代码：

• 从表单中捕获值
• 把它储存在饼干里
• 从cookie中调用值并将其存储在JS变量中
• 打印JS变量

…但我不能让它工作。我可以看到cookie设置正确，但由于某些原因，我无法检索它并将其写入变量。这是我的代码，任何帮助都将不胜感激

<!-- CAPTURE A VALUE IN A SIMPLE FORM... -->
  <input id="txt" type="text" value="foo" />
  <input id="btn" type="button" value="1 - write cookie" />
  <input id="btntwo" type="button" value="2 - set cookie to variable" />
  <input id="btnthree" type="button" value="3 - print the cookie" />

<!-- WRITE THE VALUE TO THE COOKIE WHEN A USER CLICKS THE BTN... -->
  <script type="text/javascript">                                         
   $(document).ready(function () {
    $("#btn").on("click", function () {
      $.cookie('myCookie', $("#txt").val(), { expires: 365 });
      });
    });                              
  </script> 

<!-- SET THE COOKIE VALUE TO A VARIABLE WHEN A USER CLICKS THE BTNTWO... -->
<script type="text/javascript">   
$(document).ready(function() {
  $("#btntwo").on("click", function () {
    var cookVal = $.cookie('myCookie')
  });
});
</script>     

<!-- PRINT THE COOKIE VALUE ON THE SCREEN WHEN A USER CLICKS THE BTNTHREE... -->
<script type="text/javascript">   
$(document).ready(function() {
  $("#btnthree").on("click", function () {
    document.write(cookVal);     
  });
});
</script>     

$（文档）.ready（函数（）{
$（“#btn”）。在（“单击”，函数（）{
$.cookie（'mycokie'，$（“#txt”）.val（），{expires:365}）；
});
});                              
$（文档）.ready（函数（）{
$（“#btntwo”）。在（“单击”，函数（）{
var cookVal=$.cookie（'myCookie'）
});
});
$（文档）.ready（函数（）{
$（“#btnthree”）。在（“单击”，函数（）{
文件编写（cookVal）；
});
});

首先，您不需要多个

$（document）.ready

方法

尝试时输出的内容：

$(document).ready(function () {

    $("#btn").on("click", function () {
       $.cookie('myCookie', $("#txt").val(), { expires: 365 });
    });                              

    var cookVal = 'NOT SET';

    $("#btntwo").on("click", function () {
       cookVal = $.cookie('myCookie')
    });

    $("#btnthree").on("click", function () {
       document.write(cookVal);     
    });

});

---

如果查看JavaScript中的

#btn

onclick，则保存cookie的语法是错误的。您正在添加一个额外的

}

，它将中断脚本。如果您不确定，请使用Chrome中的开发者工具或Firefox中的Firebug，并查看您的控制台。JavaScript错误在那里输出。

首先，您不需要多个

$（document）.ready

方法

尝试时输出的内容：

$(document).ready(function () {

    $("#btn").on("click", function () {
       $.cookie('myCookie', $("#txt").val(), { expires: 365 });
    });                              

    var cookVal = 'NOT SET';

    $("#btntwo").on("click", function () {
       cookVal = $.cookie('myCookie')
    });

    $("#btnthree").on("click", function () {
       document.write(cookVal);     
    });

});

---

如果查看JavaScript中的

#btn

onclick，则保存cookie的语法是错误的。您正在添加一个额外的

}

，它将中断脚本。如果您不确定，请使用Chrome中的开发者工具或Firefox中的Firebug，并查看您的控制台。JavaScript错误会在那里输出。

您不必将这些错误都放在单独的

$（文档）中。ready（function（）

您可以将它们全部放在一个文档中。这方面的缩写是：

$(function(){
............
});

---

您不必将它们分别放在一个单独的

$（文档）中。ready（function（）

您只需将它们放在一个文档中即可。此操作的简写形式还有：

$(function(){
............
});

---

您的

cookVal

变量是click handler函数的本地变量，任何外部变量都无法访问它

另外，不要使用

document。在事件处理程序中写入
。如果HTML已完全解析（并且DOM已就绪），则文档将关闭。调用
document.write
之后，将清除并重写它

顺便说一句，您可以将单独的脚本加入到单个脚本中，这可能会使代码更具可读性

<input id="txtin" type="text" value="foo" />
<button id="btn">write cookie</button>
<button id="btntwo">2 - set cookie to variable</button>
<button id="btnthree">3 - print the cookie</button>
<output id="txtout" />

<script type="text/javascript">                                         
$(document).ready(function () {
  <!-- WRITE THE VALUE TO THE COOKIE WHEN A USER CLICKS THE BTN... -->
  $("#btn").on("click", function () {
    $.cookie('myCookie', $("#txtin").val(), { expires: 365 });
  });
  <!-- SET THE COOKIE VALUE TO A VARIABLE WHEN A USER CLICKS THE BTNTWO... -->
  var cookVal; // declared local to the whole onready function
  $("#btntwo").on("click", function () {
    cookVal = $.cookie('myCookie');
  });
  <!-- PRINT THE COOKIE VALUE ON THE SCREEN WHEN A USER CLICKS THE BTNTHREE... -->
  $("#btnthree").on("click", function () {
    $("#txtout").val(cookVal);     
  });
});
</script>


写曲奇
2-将cookie设置为变量
3-打印cookie
$（文档）.ready（函数（）{
$（“#btn”）。在（“单击”，函数（）{
$.cookie（'mycokie'，$（“#txtin”）.val（），{expires:365}）；
});
var cookVal；//声明为整个onready函数的本地
$（“#btntwo”）。在（“单击”，函数（）{
cookVal=$.cookie（'myCookie'）；
});
$（“#btnthree”）。在（“单击”，函数（）{
$（“#txtout”）.val（cookVal）；
});
});

您的
cookVal
变量是click handler函数的本地变量，任何外部变量都无法访问它

另外，不要使用
document。在事件处理程序中写入
。如果HTML已完全解析（并且DOM已就绪），则文档将关闭。调用
document.write
之后，将清除并重写它

顺便说一句，您可以将单独的脚本加入到单个脚本中，这可能会使代码更具可读性

<input id="txtin" type="text" value="foo" />
<button id="btn">write cookie</button>
<button id="btntwo">2 - set cookie to variable</button>
<button id="btnthree">3 - print the cookie</button>
<output id="txtout" />

<script type="text/javascript">                                         
$(document).ready(function () {
  <!-- WRITE THE VALUE TO THE COOKIE WHEN A USER CLICKS THE BTN... -->
  $("#btn").on("click", function () {
    $.cookie('myCookie', $("#txtin").val(), { expires: 365 });
  });
  <!-- SET THE COOKIE VALUE TO A VARIABLE WHEN A USER CLICKS THE BTNTWO... -->
  var cookVal; // declared local to the whole onready function
  $("#btntwo").on("click", function () {
    cookVal = $.cookie('myCookie');
  });
  <!-- PRINT THE COOKIE VALUE ON THE SCREEN WHEN A USER CLICKS THE BTNTHREE... -->
  $("#btnthree").on("click", function () {
    $("#txtout").val(cookVal);     
  });
});
</script>


写曲奇
2-将cookie设置为变量
3-打印cookie
$（文档）.ready（函数（）{
$（“#btn”）。在（“单击”，函数（）{
$.cookie（'mycokie'，$（“#txtin”）.val（），{expires:365}）；
});
var cookVal；//声明为整个onready函数的本地
$（“#btntwo”）。在（“单击”，函数（）{
cookVal=$.cookie（'myCookie'）；
});
$（“#btnthree”）。在（“单击”，函数（）{
$（“#txtout”）.val（cookVal）；
});
});

多个就绪功能正常多个就绪功能正常检查此答案，请仔细阅读，没有说您不能拥有多个您不需要的倍数。您的答案更适合作为注释检查此答案，请仔细阅读，没有说您不能拥有多个您不需要的倍数。您的答案作为评论更合适