基本上,我想获取本地存储的项目的值,并将其设置为' span'的值。标签嵌套在' h2'标签。您将从我的代码中注意到,每次“测试”时,本地存储的数字都会增加1。单击按钮。我的代码正确存储了数字,但没有更新' span'标记 - 即使我重新加载页面。另外,我正在使用Bootstrap来代替代码的一部分:)
HTML:
<h2 class="text-center"><span class="single" id="memberCount"></span>
Members and Counting.</h2>
<button class="btn btn-success" id="test">Test</button>
使用Javascript:
var increment = 23;
$("#memberCount").val(localStorage.getItem("memberCount"));
$("#test").on('click', function () {
increment++;
if (typeof localStorage !== 'undefined') {
localStorage.setItem("memberCount", increment);
}else {
alert("Your browser is out of date. Please update.");
}
});
非常感谢你的帮助!
答案 0 :(得分:0)
故事的道德:在span标签上使用.html(),甚至更好的.text(),而不是val()
'use strict';
var increment = 23;
function setMemberCount(){
$("#memberCount").html(localStorage.getItem("memberCount"));
}
function doWork(){
increment++;
if (typeof localStorage !== 'undefined') {
localStorage.setItem("memberCount", increment);
setMemberCount();
}
else alert("Your browser is out of date. Please update.");
}
$("#test").on('click', doWork);
答案 1 :(得分:0)
使用.text()
或.html()
,因为.val()
适用于表单操作元素。
var increment = localStorage.memberCount || 23;
$("#memberCount").text( increment );
$("#test").on('click', function () {
localStorage.memberCount = ++increment;
$("#memberCount").text( increment );
});
<强> jsBin demo
P.S:不要害怕localStorage
http://caniuse.com/#search=localstorage