WebStorage简易Web留言板

原创 2015年07月08日 00:59:22

这里以localStorage为例

<!--HTML5代码-->
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="appWeb2.js"></script>//引入javaScript文件
</head>
<body>
    <p id="msg"></p>
    <!--输入框-->
    <textarea id="memo" cols="60" rows="10"></textarea><br/>
    <input type="button" value="追加数据" onclick="saveStorage('memo')">
    <input type="button" value="删除数据" onclick="clearStorage('msg')">
</body>
</html>

/**
 * Created by chenglei on 15/7/8.
 */


//JS代码
function saveStorage(id){
    var data = document.getElementById(id).value;
    var time = new Date().getTime();
    localStorage.setItem(time,data);
    alert("数据已储存");
    loadStorage('msg')
}

function loadStorage(id){
    var result = "<table border = '1'>";
    for (var i = 0;i < localStorage.length;i++){
        var key = localStorage.key(i);
        var value = localStorage.getItem(key);
        var date = new Date();
        date.setTime(key);
        result += "<tr><td>"+value+"</td><td>"+date+"</td></tr>";
    }
    result += "</table>";
    var target = document.getElementById(id);
    target.innerHTML = result;
}

function clearStorage(){
    localStorage.clear();
    alert("数据已经删除");
    loadStorage('msg');
}


版权声明:本文为博主原创文章,未经博主允许不得转载。

(七)webStorage使用实例——webStorage作为简易数据库来使用

webStorage作为简易数据库来使用
  • lmb55
  • lmb55
  • 2015年07月03日 12:24
  • 1814

(六)Web Storage的使用实例——简单web留言本

简单web留言本
  • lmb55
  • lmb55
  • 2015年07月03日 11:31
  • 2000

[React]简易留言板

效果如图:
  • FreeeLinux
  • FreeeLinux
  • 2017年12月11日 11:06
  • 135

jsp制作简易留言版

1: 学习目标 理解application 知识点: 1:vector类 这个就是实现数组的类 要使用这个类要在jsp页面加入这个 常用方法如下: Boolean add(Obje...
  • DHM00
  • DHM00
  • 2017年02月17日 22:14
  • 639

javaweb高级编程实验(吊炸天留言板系统--struts2,mysql,bootstraps3撰写,内附实验报告)

使用strut2,mysql数据库,bootstraps3实现的吊炸天留言板系统,功能(下面可以下载源码以及数据库!) 1)用户登录界面以及注册设计 2)按照留言的时间的先后顺序进行留言排序以及分页 ...
  • baidu_31657889
  • baidu_31657889
  • 2016年11月24日 17:10
  • 1661

很简单的php留言板实现

12月26日今天休息了一天,下午装ubuntu系统。感觉不错一次成功,改天把安装步骤贴上来 首先创建数据库CREATE DATABASE `bbs` 建立message表CREATE TABLE `m...
  • budinger
  • budinger
  • 2010年12月27日 00:05
  • 4561

vue.js做简易留言板

跟着网上的视频教程做了一个简易的留言板需要的自取,新手多多包涵 用户名 年龄 用户信息表 ...
  • qq_36947128
  • qq_36947128
  • 2017年05月31日 17:22
  • 1102

Vue制作简易留言板!

更新我的第一篇博客,第一篇博客跟大家分享的是自己用Vue写的一个简易留言板             整个页面由HTML(结构),CSS(表现),Js(行为)组成。             首先第一...
  • wwwwr0621
  • wwwwr0621
  • 2017年07月09日 12:08
  • 486

WebStorage 和 Cookie的区别

sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据。有了本地数据,就可以避免数据在浏览器和服务器间不必...
  • wkyseo
  • wkyseo
  • 2016年05月19日 11:18
  • 3158

使用Java+MySQL做的简易留言板

留言板是一个基本的程序,终于把这个程序运行起来了。虽然比较简单,还是经历了很多问题。 一个3个页面,一个后台处理程序,就可以运行起来了。 后续需要解决的问题: 1.引入Servlet 2.前端做一个B...
  • eeeeeeeff
  • eeeeeeeff
  • 2016年02月16日 17:31
  • 1731
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:WebStorage简易Web留言板
举报原因:
原因补充:

(最多只允许输入30个字)