我正在使用HTML5本地存储为用户制作保存游戏。 只是不起作用。 （JavaScript）

Question

This is the tutorial I have been using. It's right at the very bottom.

The functions i'm using are:

function saveGame(){
    printMessageLine("Saved.");
    localStorage['shittyInc_save'] = btoa(JSON.stringify(game));
}

function loadGame() {

    var save_data = get_cookie('shittyInc_save');
    printMessageLine("Loaded.");
    console.log(save_data);
    if (!save_data) return;
    console.log(save_data);
    game = save_data
}

the variable game looks like

    var game = {
     money: 0,
     xp: 0,
     level: 1,
     xpPimps: 0,
     slaves: 0,
     printers: 0,
     xpWhores: 0,
     slaveDrivers: 0,
     xpMines: 0,
     moneyTrees: 0,
     shittyInvestors: 0,
     shitMoney: 0,
     shittyCompanies: 0,
     moneyPigs: 0,
     shittyBitcoins: 0
};

the variable is used correctly and has been tested.

I have a button that uses saveGame(); and loadGame();

<p><button onclick="saveGame()" style="background: #ccc url(triangular.png); padding: 0.2em 2em"">Save</button></p>
     <p><button onclick="loadGame()" style="background: #ccc url(triangular.png); padding: 0.2em 2em"">Load</button></p>

nothing seems to do anything, what am I missing?

Got It, fixed code below:

  function loadGame() {

    var save_data = localStorage['shittyInc_save']
    printMessageLine("Loaded.");
    console.log(save_data);
    if (!save_data) return;
    console.log(save_data);

    game = JSON.parse(atob(localStorage['shittyInc_save']))
}

Answer 1

You get the data from localStorage the same way you stored it there, not with get_cookie .

var data = 'some data';
//save to localStorage
localStorage['myData'] = data;

//get from localStorage
var fromStorage = localStorage['myData']; //'some data'

Side note: inline javascript is bad practice and will cause you troubles. Read these results: https://www.google.com/search?q=Why+is+inline+js+bad%3F It is best practice to attach the event listener with addEventListener , like this:

Markup:

<button id="myButton"></button>

JavaScript:

var myButton = document.getElementById('myButton');
myButton.addEventListener('click', myClickFunction);

myClickFunction(event) {
  //do something
}

Here's a complete example demonstrating click functions with saving and loading from localStorage . Try it out by typing into the input and click "save". You can then change the input or reload the page and get the value back by clicking "load". Live demo here (click).

Markup:

<input id="save-data" type="text" placeholder="type data here">
<button id="save">Save</button>
<button id="load">Load</button>

JavaScript:

var save = document.getElementById('save');
var load = document.getElementById('load');
var saveDataInput = document.getElementById('save-data');

save.addEventListener('click', function() {
  saveGame();
});

load.addEventListener('click', function() {
  loadGame();
});

function saveGame() {
  localStorage.saveData = saveDataInput.value;
}

function loadGame() {
  saveDataInput.value = localStorage.saveData;
}

Answer 2

The tutorial correctly uses the localStorage[] object for both saving and loading.

About 2/3 through http://blog.samgb.com/incrementals-from-zero-to-hero-part-3/

We interface with local storage like this:

Saving

localStorage['clickclick_save'] = btoa(JSON.stringify(player));

Loading

player = JSON.parse(atob(localStorage['clickclick_save']))

The code you posted mismatches two different ways of storing and loading game data that are taught in the tutorial. It is as though you left your wallet under the bed and then looked for it in a drawer.