<! DOCTYPE html>
<meta charset= "UTF-8" >
<title>web Storage's Simple message board </title>
<style type= "Text/css" >
: root{
margin:5px;
}
textarea{
width:100%;
height:200px;
}
. liuyan-container{
width:100%;
}
. well{
position:fixed;
top:20px;
left:40%;
}
. fbsj{
font-size:12px;
}
</style>
<script type= "Text/javascript" src= "Http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js" ></script >
<link rel= ' stylesheet ' href= "Http://apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap.min.css" >
<script type= "Text/javascript" >
var ws = Sessionstorage;
var ws = Window.localstorage;
var randomimg = "Rar.png";
function Addinfo () {
var Liuyan = $ ("#liuyan");//Why is the global variable defined as undefined?
if (liuyan.val () = = "") {
}
var media = ' <div class= ' media ' ><div class= ' media-left ' ></div> <div class= "Media-body" ></div></div> ";
var date = new Date ();
var text = ' <div class= ' media "><div class=" Media-left "></div> ' +
' <div class= ' media-body ' > ' +liuyan.val () + ' <br/> <span class= ' FBSJ ' > Release time: "+date.tolocalestring () + ' </span></div></div> '
if (ws. Myboard) {
Ws. Myboard + = text;
}else{
Ws. Myboard = text;
}
Showinfo ();
}
function Showinfo () {
var Showliuyan = $ ("#showliuyan");
Showliuyan.html (ws. Myboard);
}
function Clearinfo () {
Ws.clear ();
Ws.removeitem ("Myboard");
var Showliuyan = $ ("#showliuyan");
Showliuyan.html ("");
$ ("#liuyan"). Val ("");
}
Window.onload = function () {
Showinfo ();
}
</script>
<body >
<div class= "Well" >web Storage's simple message board </div>
<div class= "Row col-xs-6" id= "Showliuyan" >
</div>
<textarea name= "Readtextarea" id= "Liuyan" placeholder= "to this Tour" ></textarea>
<div class= "Btn-group pull-right" >
<button id= "Addinfo" class= "btn btn-success" onclick= "Addinfo ()" > Message </button>
<button id= "Clearinfo" class= "btn btn-primary" onclick= "Clearinfo ()" > Clear </button>
</div>
</body>
WS Message Board