首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

jquery实现表格动态添加

//点击追加触发 $(function(){ $("#button").click(function(){ var div_ = $("#sel").val(); var context = $("#context").val(); append(div_,context); //$("#tab tr:not(:first)").remove(); //$("#tab tbody").empty(); $("#tab tbody").remove(); query(); }); }); //点击查询全部触发 $(function(){ $("#but").click(function(){ $("#tab tbody").remove(); //$("#tab tr:not(:first)").remove(); //$("#tab tbody").empty(); query(); }); }); //点击模糊查询触发 $(function(){ $("#query").click(function(){ var context = $("#context").val(); alert("您输入的内容为:"+context); $("#tab tr:not(:first)").empty(); //$("table tbody").remove(); queryByContext(); }); }); //删除事件 function del(id){ var url = "testController/delModel"; $.ajax({ type: 'POST', url: url, data:{id: id}, dataType: 'json', success: function(data){ alert("数据库删除成功"); $("#tab tr:not(:first)").empty(); query(); }}); }; //编辑事件 function upd(id){ var url = ""; $.ajax({ type: 'POST', url: url, data:{id: id}, dataType: 'json', success: function(data){ alert("数据库编辑成功"); $("#tab tr:not(:first)").empty(); query(); }}); } //添加方法 function append(div_,context){ $("#"+div_).append(""+ div_ +""+""+context+""); $.get("testController/addModel",{div_id: div_, context: context }).done(function( data ) { alert("添加到数据库成功"); }); }; //模糊查询方法 function queryByContext(){ var url = "testController/queryAllDataByContext"; $.ajax({ type: 'POST', url: url, data:{context:$("#context").val()}, dataType: 'json', success: function(data){ alert("数据库查询成功"); console.log(data); for(var i=0;i<data.length;i++){ var id = data[i].id; var divId = data[i].divId; var context = data[i].context; var dtt = data[i].dtt; //alert(id); $("#tab thead").append(""+id+""+""+divId+""+""+context+""+""+dtt+""+"删除"); } }, error:function(){ alert("数据库查询失败"); } }); }; //查询全部方法 function query(){ var url = "testController/queryAllData"; $.ajax({ type: 'POST', url: url, dataType: 'json', success: function(data){ alert("查询成功"); con

05

表格:table、tr、td 标签

表格:table、tr、td的使用 一、表格语法 表格标签

类似于 Excel 中的表格,是一个行、列组成的二维表格。 其中 表示表格头, 表示表格的主体 表示一行 表示表格头 中的一列 表示表格中的一列

01

标签

标签定义HTML表格的表头,并用于组合HTML表格的头部内容。应与标签结合起来使用。元素用于对HTML表格中的主体内容分组。而标签用于对HTML表格中的表注内容分组。

01
表头放在thead里面,数据放在tbody里面(thead,tbody,tfoot 这三个是表格自身就拥有的,不是自己创造的;)这样就更直观了.当点击thead里面tr里的td后,触发排序事件,将tbody里的某列进行排序. 2)统一排序函数. 为了代码的简易,整个表格排序用一个函数,不同的列排序只是传递的参数不同;比如,第一列传1, 第二列则传2;但因为每列的数据类型可能不同,所以要进行判断.而且要将数据转换成可比较的类型.甚至可以通过传的参数不同获得不同的比较函数; 3)将要排序的列获取到,放在数组中; 为了程序的简单,可以直接把tr放在数组中,然后在比较函数中进行取值.将tr放在数组中时不会从表格中删除tr元素.因为仅仅存储了指针,并不是实际的元素. 4)排序 对数组里数据的类型进行判断,然后根据类型,进行转换,转成可转换的类型;然后用自己写的比较函数进行比较;得到排好序的数组; 5)按已排序的数组生成新的表格; 6)创建文档碎片,将新表格绑定在碎片一; 7)将文档碎片绑定在tbody上,从而实现了在用户看来刷新了表格的目的; 举个详细的例子: 一个2*3的表格;一列里面放的是名字,一列里面是图片;直接对图片肯定不能排序,所以要在图片的td里面自定义一个值.如:加一个value属性;

02

标签

标签定义HTML表格的页脚(脚注)。另外以及元素能够对表格中的行进行分组。

02
中有中有....,而不是中有个其他不该属于的标签,比如自己定义一个组件,里面模板还是....,这样会失败!

01
领券