2 qq 28242723 qq_28242723 于 2016.02.21 08:50 提问

Web Storage 为什么用不了removeItem函数

我已经编写好了这样一串代码

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript">
var pgCt = window.localStorage.getItem("pageCount");
/*在sessionStorage中定义数据*/
window.sessionStorage.setItem("myFirstKeyInSessionStorage","valueA");
window.sessionStorage.setItem("peter","dog");
window.sessionStorage.setItem("bill","boy");
window.sessionStorage.setItem("lily","girl");
/*在localStorage中定义数据*/
window.localStorage.setItem("myFirstKeyInLocalStorage","valueA");
window.localStorage.setItem("hitler","a bad guy");
window.localStorage.setItem("washington","a good guy");
window.localStorage.setItem("bob","a friend");
/*检测浏览器是否支持Web Storage*/
function checkStorageSupport(){
    if(window.sessionStorage){
        alert("浏览器支持window.sessionStorage");
    }else{
        alert("浏览器不支持window.sessionStorage");
    }
    if(window.localStorage){
        alert("浏览器支持window.localStorage");
    }else{
        alert("浏览器不支持window.localStorage");
    }
    if(!window.sessionStorage||window.localStorage){
        alert("看来这个网页你没法使用了!换个浏览器吧!\n比如chrome");
    }
    return 0;
}
/*其它钩子函数*/
function findItemSessionStorage(){
    var key=prompt("请输入数据项","");
    var value=window.sessionStorage.getItem(key);
    alert(key+"的值为"+value);
    return 0;
}

function findItemLocalStorage(){
    var key=prompt("请输入数据项","");
    var value=window.localStorage.getItem(key);
    alert(key+"的值为"+value);
    return 0;
}

function setItemSessionStorage(){
    var key=prompt("请输入要添加或设置的数据项","");
    var value=prompt("请输入"+key+"的值","");
    window.sessionStorage.setItem(key,value);
    alert("操作成功");
    return 0;
}

function setItemLocalStorage(){
    var key=prompt("请输入要添加或设置的数据项","");
    var value=prompt("请输入"+key+"的值","");
    window.localStorage.setItem(key,value);
    alert("操作成功");
    return 0;
}
/*该区块不可用*/
function removeItemSessionStorage(){
    var key=prompt("请输入要移除的数据项","");
    eval("window.sessionStorage.removeItem("+key+");");
    alert("成功移除"+key);
    return 0;
}

function removeItemLocalStorage(){
    var key=prompt("请输入要移除的数据项","");
    eval("window.localStorage.removeItem("+key+");");
    alert("成功移除"+key);
    return 0;
}

function getLoc(){
    var a=window.location.toString()
    alert(a);
}

function onload(){
    if(pgCt!=null&&pgCt!=undefined){
        pgCt++;
    }else{
        pgCt=1;
    }
    window.localStorage.pageCount=pgCt;
    var obj = document.getElementById("lb1");
    obj.innerHTML=pgCt;
}
</script>
<title>数据库</title>
</head>

<body onload="onload();">
<font id="Sz" size="+0">
<form name="test">
<p>测试</p>
<button name="storageSupportChecker" onclick="checkStorageSupport()">测试是否存在sessionStorage和localStorage</button>
</form>
<form name="getItems">
<p>获取数据</p>
<button name="getItemSS" onclick="findItemSessionStorage()">在sessionStorage中获取数据</button>
<button name="getItemLS" onclick="findItemLocalStorage()">在localStorage中获取数据</button>
</form>
<form name="setItems">
<p>设置数据和添加数据</p>
<button name="setItemSS" onclick="setItemSessionStorage()">在sessionStorage中设置和添加数据</button>
<button name="setItemLS" onclick="setItemLocalStorage()">在localStorage中设置和添加数据</button>
</form>
<!--以下控件正在开发-->
<form name="removeItems">
<p>移除数据</p>
<button name="removeItemSS" onclick="removeItemSessionStorage()">在sessionStorage中移除数据</button>
<button name="removeItemLS" onclick="removeItemLocalStorage()">在localStorage中移除数据</button>
</form>
<form name="other">
<p>杂项</p>
<button name="getLocation" onclick="getLoc()">查看该网页链接</button>
</form>
<form name="testform">
访问次数:<label id="lb1"/>
</form>
</font>
</body>
</html>

显示的页面是这样的:
图片说明
但是为什么removeItem函数在网页中用不了
但是在chrome的控制台中执行window.sessionStorage.removeItem(key)或window.localStorage.removeItem(key)却可以

3个回答

a695929533
a695929533   2016.02.21 11:08

CSDN真辣鸡,上面的答案也是我的,字体加粗之后乱码了。
removeItemLocalStorage()里的eval改成这样:

eval("window.localStorage.removeItem('"+key+"');")
key穿进去后直接是 value,而非 'value' (一个是字符串,一个是字符串对象)。

showbo
showbo   Ds   Rxr 2016.02.21 12:14

直接移除就行了,干嘛要eval。。eval你的key要用引号括起,要不就是传递变量(输入值为字母)或者数字的。

       /*该区块不可用*/
        function removeItemSessionStorage() {
            var key = prompt("请输入要移除的数据项", "");
            window.sessionStorage.removeItem(key);
            //eval("window.sessionStorage.removeItem(" + key + ");");
            alert("成功移除" + key);
            return 0;
        }

        function removeItemLocalStorage() {
            var key = prompt("请输入要移除的数据项", "");
            window.localStorage.removeItem(key);
            //eval("window.localStorage.removeItem(" + key + ");");
            alert("成功移除" + key);
            return 0;
        }
a695929533
a695929533   2016.02.21 11:04

函数 removeItemLocalStorage()里面的eval改成这样:
** eval("window.localStorage.removeItem('"+key+"');");**

key穿进去后直接是 value,而非 'value' (一个是字符串,一个是字符串对象)。

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
关于webstorage的使用
概述 这个API的作用是,使得网页可以在浏览器端储存数据。它分成两类:sessionStorage和localStorage。sessionStorage保存的数据用于浏览器的一次会话,当会话结束(通常是该窗口关闭),数据被清空;localStorage保存的数据长期存在,下一次访问该网站的时候,网页可以直接读取以前保存的数据。除了保存期限的长短不同,这两个对象的属性和方法完全一样。它们很像coo
轻量级插件sdstorage用于操作localStorage支持过期、批量搜索删除等
前言项目中在某一界面需要做较为复杂的交互,为方便处理,多数数据操作都前端完成,最终保存时才保存到数据库,为了保证界面意外关闭再打开时数据仍保持,则需要将数据保存在本地,本来是想用cookie的,想到数据大小有限制(4k),只好换用localStorage,然而localStorage不支持自动期,只好自己写个插件来满足要求。插件源码/*! * Copyright (C) Corporation.
atoi函数为什么用不了
#include #include main() { char c; int i; c='34'; i=atoi(c); printf("%d",i); }
(七)webStorage使用实例——webStorage作为简易数据库来使用
webStorage作为简易数据库来使用
基于AD603的AGC电路
数据手册上的推荐电路,不知道为什么用不了
sessionStorage和localStorage储存的用法(两个的区别在于,session删除页面后就删除,local依然存在)(浏览器储存方法)
        sessionStorage.setItem(&quot;key&quot;, &quot;value&quot;); 存储到key var value = sessionStorage.getItem(&quot;key&quot;); 获取key sessionStorage.removeItem(&quot;key&quot;); 删除key sessionStorage.clear(); 删除所有存起来的数据...
js 对象借用方法和sessionStorage用法。
本文包括两个部分。 第一部分记录js 一个对象借另一个对象的方法 。 call和apply基本一致,区别在于用法上,一个是传入一个数组 ,一个是直接传入参数。 第二部分记录sessionStorage常用的四个方法。
HTML5 Web存储(Web Storage)技术以及用法
使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是 cookie。但是Web 存储需要更加的安全与快速,这些数据不会被保存在服务器上,但是这些数据只用于用户请求网站数据上。它也可以存储大量的数据,而不影响网站的性能。数据以 键/值 对存在, web网页的数据只允许该网页访问使用。       Web Storage的目的是为了克服由cookie带来的一些限制,当数据需要被
认识H5中Web Storage
认识h5中Web Storage Cookie的缺点 Web Storage对象 sessionStorage对象
WebStorage 和 Cookie的区别
sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据。有了本地数据,就可以避免数据在浏览器和服务器间不必要地来回传递。 cookiecookie在浏览器和服务器间来回传递,主要应用场景: 保持登录 保持上次查看的页面 浏览计数 广告追踪 购物车的状态保持 Cookies是如何起效的? 当浏览器从web的