通过localStorage 来实现留言板

发布时间:2020-08-07 23:54:10 作者:东方部落
来源:网络 阅读:423
<!DOCTYPE html>
<html>
	<head>
	<meta charset="UTF-8">
	<title>小小留言板</title>
	</head>
	<body>
		<div>
			<textarea id="trCon" cols="30" rows="8"></textarea>
		</div>
		<div>
			<input type="button" value="发表" onclick="posCon()"/>
			<input type="button" value="清除" onclick="delCon()"/>
		</div>
		<div id="dCon"></div>
		
		<script type="text/javascript" src="jquery.js"></script>
		<script type="text/javascript">
			// 发表留言
			function posCon() {
				var pv = $("#trCon").val;
				$("#dCon").append('<div>'+pv+'</div>');
				localStorage.setItem("k_con",$("#dCon").html());
			}	
			// 清除留言
			function delCon(){
				$("#dCon").html("");
				localStorage.clear();
			}
			// 加载留言
			load();
			function load(){
				var name = localStorage.getItem("k_con");
				if(name!=null){
					$("#dCon").html(name);
				}
			}
		</script>
	</body>
</html>

不要忘记添加上jquery包

推荐阅读:
  1. 使用HTML5 Web存储的localStorage方式进行
  2. vue中如何使用localstorage来存储页面信息

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

storage local age

上一篇:高端访谈| 天融信开拓企业级WLAN市场新格局

下一篇:免费的DNG格式图片转换器​Adobe DNG Converter for Mac v12.3.0.493中文版

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》