HTML代:<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="app.js"></script>
</head>
<body>
<h1>Web Storage 示例</h1>
<div>
<p id="xian"></p>
<input type="text" id="mg" >
<input type="button" value="保存数据" onclick="saveStorage('mg');">
<input type="button" value="读取数据" onclick="loadStorage('xian');">
</div>
</body>
</html>
外调的js如下:
window.onload=function(){
function saveStorage(id){
var target=document.getElementById(id);
var str=target.value;
sessionStorage.setItem("message",str);
}
function loadStorage(id){
var target=document.getElementById(id);
var msg=sessionStorage.getItem("message");
target.innerHTML=msg;
}
};
用了window.onload之后就报错。去掉它就成功。
可是window.onload函数不就是等页面加载完成之后再去执行么?感觉没有什么错误啊,,哭泣。求解答
onclick="saveStorage('mg');"和onclick="loadStorage('xian');"调用的window对象中的saveStorage和loadStorage,可是你的代码这两个函数在load的匿名函数中,是局部函数定义,所以调不到,会报错。这么写,就不会报错了。
window.onload=function(){
var saveStorage = window.saveStorage = function(id){
var target=document.getElementById(id);
var str=target.value;
sessionStorage.setItem("message",str);
};
var loadStorage = window.loadStorage = function(id){
var target=document.getElementById(id);
var msg=sessionStorage.getItem("message");
target.innerHTML=msg;
};
};
window.onload是你要使用到dom对象时,而你的dom对象在script下面才需要
你那2个函数放到onload匿名函数里面,只能onload里面能访问到
onxxx这种直接加载dom对象上的事件需要window作用域下的函数,访问不到onload里面2个私有匿名函数
自己去了解下作用域相关知识
window.onload也就是在浏览器解析你的html代码以后才执行相应的js函数。这样的好处是防止js获取不到你的dom元素。
你这个是外调的js,应该就不需要加window.onload,你试着全部写到页面上应该就不会报错吧
把函数定义到onload外面, 在onload里面执行