简单的HTML5 Web Storage留言册

最新推荐文章于 2024-07-26 11:09:07 发布

angsequ1746

最新推荐文章于 2024-07-26 11:09:07 发布

阅读量110

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/dsfderek/archive/2012/05/03/2480754.html

版权

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>HTML5 WebStorage 留言本</title>
    <script type="text/javascript">
        // JavaScript Document
        function savelocalStorage(id) {
            var data = document.getElementById(id).value;
            var time = new Date().getTime();
            localStorage.setItem(time, data);
            loadlocalStorage('msg');
        }

        function loadlocalStorage(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);
                var datestr = date.toGMTString();
                result += '<tr><td>' + value + '</td><td>' + datestr + '</td></tr>';
            }
            result += '</table>';
            var target = document.getElementById(id);
            target.innerHTML = result;
        }

        function clearlocalStorage() {
            localStorage.clear();
            loadlocalStorage('msg');
            alert("localStorage留言已被清除！");
        }
    </script>
</head>
<body>
<h3>HTML5 WebStorage 留言本</h3>
<textarea id="demo" cols="60" rows="10"></textarea><br/>
<input type="button" value="留言" onclick="savelocalStorage('demo');"/>
<input type="button" value="清除留言" onclick="clearlocalStorage('msg');"/>
<hr/>
<p id="msg"></p>
</body>
</html>

转载于:https://www.cnblogs.com/dsfderek/archive/2012/05/03/2480754.html

angsequ1746

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
简单的HTML5 Web Storage留言册

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><...
复制链接

扫一扫