javascript - 浏览器关闭时数据被删除。

Question

我有这个存储锦标赛结果的游戏板，但我不明白为什么关闭浏览器时数据(通过下拉菜单输入的游戏结果)会被删除。有没有办法让我的结果在服务器运行时一直存在？

结果在 main.js 中显示如下:

$.post('/postScores', results, function(scores){
  var gameBoard = "";
      for(var j=0;j<scores.length;j++){
          gameBoard+= '<tr>';

          for(var k=0;k<5;k++){             
            gameBoard += '<td>'+scores[k][j]+'</td>';
          }
          gameBoard += '</tr>';
      }

      $("#grid").append(gameBoard);

  });

我的分数像这样存储在 server.js 中:

 app.post("/postScores", function(req , res){ 
    res.setHeader("Content-Type", "application/json");

    var results = [
  [ "", "team1", "team2", "team3", "team4"],
  ["team1", "x", req.body.e, req.body.h, req.body.k],
  ["team2", req.body.b, "x", req.body.i, req.body.l],
  ["team3", req.body.c, req.body.f, "x", req.body.m],
  ["team4", req.body.d, req.body.g, req.body.j, "x" ]
  ];

   res.json(results);
   res.end();

});

完整程序:https://jsfiddle.net/Amidi/egp1hst3/10/

Answer 1

当您使用 javascript 修改当前查看的页面时，这些更改本质上是临时设计的。下次您加载同一页面时，它会再次从浏览器加载 HTML 结构并以其原始状态呈现给您。这确实很有意义，因为您希望浏览器呈现服务器发送给您的页面，而不是其他内容。

如果您想对 UI 进行永久更改，您需要将状态存储在服务器上并将更改包含在 html 响应中，或者将状态保存在客户端(例如在 cookie 或本地存储中)然后加载页面后从那里应用修改。