jQuery表格增删改查

功能：
增加：复制第一行插入在最后
查询：在文本框中输入id号，查相对应的信息
删除：删除该行
修改：隐藏“修改”，显示“保存”，在非功能td里面插入文本框，在文本框中输入要修改的值，点击“保存”
保存：保存td里面input的值，点击保存以后，隐藏“保存”，显示“修改”

body内标签

<p>
			<a href="#">增加</a>
			<input type="text"/>
			<a href="#">查询</a>
		</p>
		<table border="1px">
			<tr>
				<th>ID</th>
				<th>姓名</th>
				<th>薪水</th>
				<th>功能</th>
			</tr>
			<tr>
				<td class="id">1</td>
				<td>张三</td>
				<td>8000</td>
				<td>
					<a href="#" class="save" style="display: none;">保存</a>
					<a href="#" class="xg">修改</a>
					<a href="#" class="sc">删除</a>
				</td>
			</tr>
			<tr>
				<td class="id">2</td>
				<td>李四</td>
				<td>9000</td>
				<td>
					<a href="#" class="save" style="display: none;">保存</a>
					<a href="#" class="xg">修改</a>
					<a href="#" class="sc">删除</a>
				</td>
			</tr>
		</table>

css样式

无

jQuery脚本

<script>
			$(function(){
				//增加事件
				$("a:contains('增加')").click(function(){
					$("table tr:eq(1)").clone(true).appendTo($("table tr:eq(1)").parent());
				})
				//查询事件
				$("a:contains('查询')").click(function(){
					var $aa=$(this).siblings().eq(1).val();//获取文本框的值
					if($aa!="")
					{
						
						$(".id").each(function(){
							if($(this).text()==$aa)
							{
								$(this).parent().show();
								$(this).parent().siblings().hide();
							}
						})
					}
					
				})
				//删除事件
				$("a:contains('删除')").click(function(){
					$(this).parent().parent().remove();
				})
				//修改事件
				$("a:contains('修改')").click(function(){
					var $a=$(this).parent().parent().children();//获取当前列的td集合
					for(var i=0;i<$a.length;i++)
					{
						var $td=$a.eq(i);
						if($td.children().length<=0)
						{
							var html="<input type='text' value='"+$td.text()+"'/>";
							$td.html(html);
						}
					}
					$(".xg").hide();
					$(".save").show();
				})
				//保存按钮
				$("a:contains('保存')").click(function(){
					var $tr=$(this).parent().parent();//获取tr
					var $an=$tr.find("input[type='text']");
					for(var i=0;i<$an.length;i++)
					{
						var ipt=$an.eq(i);
						ipt.parent().text(ipt.val());
						ipt.remove();
					}
					$(".xg").show();
					$(".save").hide();
				})
			})
		</script>