jQuery文本追加留言板

最新推荐文章于 2025-03-20 16:59:52 发布

最好结果

最新推荐文章于 2025-03-20 16:59:52 发布

阅读量381

点赞数 2

分类专栏： jQuery html 文章标签： jquery html

本文链接：https://blog.youkuaiyun.com/qq_48307365/article/details/116075282

版权

html 同时被 2 个专栏收录

10 篇文章

订阅专栏

jQuery

6 篇文章

订阅专栏

留言板留言 jQuery文本追加

效果图效果图！！

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
		
		<style type="text/css">
			#div1{
				border: 1px solid red;
			width: 500px;
			 
		}
		#mss{
				border: 1px solid red;
			width: 500px;
			 height: 200px;
			  overflow:auto;
			  
		}
		#showmsg{
			border: 1px solid blue;
			width: 500px;
			height: 200px;
			 overflow:auto;
		}
		#div2{
			border: 1px solid blue;
			width: 500px;
			height: 20px;
			 
		}
		#div3{
			border: 1px solid blue;
			width: 500px;
			height: 40px;
			 
		}
		ul{
			padding: 0;
			margin: 0;
			list-style: none;
		}
		</style>
		<script>
			$(document).ready(function(){
//				$("input").click(function(){
//					alert($("P").attr("title"))
//					$("P").removeAttr("title");
//					alert($("P").attr("title"))
//				})

          /*      $("#mss").load("jquery005.html #showmsg") */
              $("#butmsg").click(function(){
				  
              	var $li1="<li>"+$("#nc").val()+"</li>";
              	var $li2="<li>"+$("#msg").val()+"</li>";
              	$("ul").append($li1).append($li2);
         /*   $("#mss").load("jquery005.html #showmsg")*/
              })
			}) 
		 
		 
		</script>
	</head>
	<body>
		<!-- <div id="mss">
			
		</div>
		<p title="sss">ssada</p> -->
		<!-- <input type="button" value="ss" /> -->
		
		<div id="div1">
			<div id="showmsg">
				<ul></ul>
			</div>
			<span>昵称</span>
			<div id="div2">
				<input type="text" id="nc" style="width: 98%;" />
			</div>
			<span>发送内容</span>
			<div id="div3">
				<textarea id="msg" style="width: 98%;"></textarea>
			</div>
			<input type="button" id="butmsg" value="点击发送试试" style="width: 100%;" />
		</div>
	</body>
</html>

动动你发财的小手指，举手之劳，赞有余香！