您的位置：首页 > 编程语言

使用localStorage进行本地存储代码

2017-07-17 16:32 459 查看

localStorage的使用方法见：

http://blog.csdn.net/pedrojuliet/article/details/62889501

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,minimum-scale=1.0">
<title>FileReader</title>
</head>
<body>
<div id="file-div">
<input type="file" name="inputfile" accept="text/plain, text/css, text/html, text/javascript, text/markdown" />
<textarea name="filereader" placeholder="......."></textarea>
<button type="button" name="storebutton">本地存储</button>
<button type="button" name="clearbutton">清除存储</button>
</div>

<script>
window.onload = function(){
var text = document.getElementsByName('filereader')[0],
inputFile = document.getElementsByName('inputfile')[0],
storeButton = document.getElementsByName('storebutton')[0],
clearButton = document.getElementsByName('clearbutton')[0];
// 检测localStorage中是否已有缓存
if(window.localStorage.getItem('textareaStorage')) {
alert('检测到本地存储的文件，已为您自动恢复');
text.value = window.localStorage.getItem('textareaStorage');
}
//上传文件
inputFile.onchange = function(){
console.log(this.files);
var reader = new FileReader();
reader.readAsText(this.files[0], 'UTF-8');
reader.onload = function (e) {
// urlData就是对应的文件内容
var urlData = this.result;
text.value = urlData;
};
};

// 存储文件
storeButton.onclick = function(){
window.localStorage.setItem('textareaStorage', text.value);
alert('保存成功');
};

// 清除存储
clearButton.onclick = function(){
window.localStorage.removeItem('textareaStorage');
alert('清除成功');
};
};
</script>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 本地存储代码

相关文章推荐

新的分享

章节导航