jQuery学习17---无刷新评论

最新推荐文章于 2022-08-21 17:46:10 发布

原创最新推荐文章于 2022-08-21 17:46:10 发布 · 796 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#无刷新评论

jQuery 专栏收录该内容

22 篇文章

订阅专栏

本文介绍了一个使用jQuery实现的简单网页应用，该应用可以动态地创建一个表格来展示用户提交的评论。用户输入姓名和评论内容后点击提交按钮，系统会在表格的最上方添加一行显示最新评论。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=GBK">
		<title></title>
		<script src="../jquery-1.8.2.js" type="text/javascript"></script>
		<style type="text/css">
		</style>
		<script type="text/javascript">
			$(function()
			{
				$("#sub").click(function()
				{
					var name = $("#textName").val();
					var content = $("#textContent").val();
					
					var $tb = $("#tb");
					if($tb.length==0)
					{
						//动态创建Table
						$tb = $("<table id='tb'></table>");
						$tb.attr("border","1px");
						$tb.attr("width","400px");
						$("#reply").append($tb);
					}
					
					
					
					var $tr = $("<tr></tr>");
					//把最新的评论放在最上面
					$tb.prepend($tr);
					
					var $td = $("<td>"+name+"</td>");
					$tr.append($td);
					
					var $td = $("<td>"+content+"</td>");
					$tr.append($td);
				});
			});
		</script>
	</head>
	<body>
		<div id="reply"></div>
		<input id="textName" type="text"/><br />
		<textarea id="textContent"></textarea><br />
		<input id="sub" type="button" value="提交">
	</body>
</html>