HTML+jQuery点击游戏localStorage存取金币出现字符串拼接问题求助

问题根源有两个：

• localStorage存的是字符串：直接获取的值是字符串类型，执行cash += booster时会触发字符串拼接，而非数字加法。
• 初始化顺序错误：你先把cash设为0，之后才从localStorage读值，而且点击事件绑定在读取操作之前，导致点击时cash可能是未转换的字符串。

修正后的JavaScript代码 #

var cash;
var booster = 1;

// 先读取本地存储，转成数字；如果没有值，初始化为0
cash = parseInt(localStorage.getItem('cash')) || 0;
$('span.cash').text(cash);

// 绑定点击事件
$('h1.floppa').on('click', function(){
    cash += booster;
    $('span.cash').text(cash);
    localStorage.setItem('cash', cash);
});

核心修改说明 #

1. 把读取localStorage的逻辑移到点击事件绑定之前，确保点击时cash已经是正确的数字类型。
2. 用parseInt()将localStorage获取的字符串转为整数，同时用|| 0处理首次访问的情况（此时localStorage无数据，getItem返回null，转成数字后是NaN，NaN || 0会取0作为初始值）。
3. 调整代码顺序，避免初始值被后续的赋值覆盖。

这样修改后，页面重载能正常显示之前的金币数，点击时也会正确执行数字加法，不会出现字符串拼接的问题。

内容的提问来源于stack exchange，提问作者Phoenix