<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> textarea { width: 500px; height: 200px; } </style></head><body> <div> <h2>簡單的web存儲留言板</h2> <textarea id="t1"></textarea> <br /> <input type="button" class="button" onclick="addInfo()" value="留言" /> <input type="button" class="button" onclick="cleanInfo()" value="清除留言" /> <br /> <hr /> <label id="shows"></label> <textarea id="show" readonly="readonly"></textarea> </div> <script type="text/javascript"> //使用HTML5 Web存儲的localStorage方式進行編寫一個Web頁面。 //功能是一個簡易的Web留言板。留言板信息可以永久保存。并能清楚留言板內容。參考頁面如下圖： function upInfo() { var lStorage = window.localStorage; var show = window.document.getElementById("show"); if (window.localStorage.myBoard) { show.value = window.localStorage.myBoard; } else { var info = "還沒有留言"; show.value = "還沒有留言"; } } function addInfo() { var info = window.document.getElementById("t1"); var lStorage = window.localStorage; if (lStorage.myBoard) { var date = new Date(); lStorage.myBoard += t1.value + "/n發表時間：" + date.toLocaleString() + "/n"; } else { var date = new Date(); lStorage.myBoard = t1.value + "/n發表時間：" + date.toLocaleString() + "/n"; } upInfo(); } function cleanInfo() { window.localStorage.removeItem("myBoard"); upInfo(); } upInfo(); </script></body></html>
新聞熱點
疑難解答
