如何让这个javascript var跨HTML页面工作?

时间:2015-03-29 15:36:08

标签: javascript jquery html session-storage

第1页:

<html>
<head>
</head>
<body>
    <input type="checkbox" class="checkbox" name="item" value="X">Value X<br>
    <input type="checkbox" class="checkbox" name="item" value="Y">Value Y<br>
    <script type='text/javascript'>
        var score = 0;
        $('.checkbox').click (function(){
          var thisCheck = $(this);

          if ( thisCheck.is(':checked') ) {
            score = score + 1;
          }
        });
        sessionStorage.score = score;
    </script>
    <button type="button" onclick="window.location.href='page2.html'">Continue</button>
</body>
</html>

第2页:

<html>
<head>
</head>
<body>
    <script type='text/javascript'>
    var score = sessionStorage.getItem('score');
    document.write(score);
    </script>
</body>
</html>

第2页始终打印为空。我该如何解决这个问题? (如果同时选中了两个复选框,我们需要第2页打印2,例如)

谢谢!

N.B。我知道有一个简单的解决方案,通过将表单操作写入asp文件然后读取它,但我无法在此系统上创建新文件。

4 个答案:

答案 0 :(得分:1)

首先,您的复选框中没有一个实际上有一个&#39;复选框&#39;这样即使你选中其中一个复选框,jquery事件也永远不会触发。

另外,您将变量声明为thisCheck,但尝试使用thischeck访问它(请注意小写c)。 Javacript是区分大小写的,所以&#39; thischeck&#39;永远不会被赋予价值。

答案 1 :(得分:0)

您没有很好地设置会话,您需要这样做 sessionStorage.setItem("score", score)

答案 2 :(得分:0)

您需要在每次点击时设置sessionStorage值:

var score = 0;
$('.checkbox').click (function() {
  if (this.checked) {
      score = score + 1;
  }
  sessionStorage.score = score;
});
sessionStorage.score = score;

注意,如果可能要扣除1,如果未选中复选框,请尝试此代码:

var score = 0;
sessionStorage.score = score;

$('.checkbox').click (function() {
    score = score + (this.checked ? 1 : -1);
    sessionStorage.score = score;
});

顺便说一句,您需要将class="checkbox"添加到输入中。

答案 3 :(得分:0)

我找到了解决方案。无论出于何种原因,score被解析为Int以外的东西。

使用score = parseInt(score) + 1;解决了问题。

感谢所有提交答案的人!我们最终到达那里。