jquery 对 table 的操作

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script src="Scripts/json2.js"></script>
<script>

var table = $("<table border=\"1\">");
table.appendTo($("#createtable"));

var trHeader = $("<tr></tr>");
trHeader.appendTo(table);
for (var j = 0; j < cellCount; j++) {
var td = $("<td>" + data.columns[j].title + "</td>");
td.appendTo(trHeader);
}

for (var i = 0; i < rowCount; i++) {
var tr = $("<tr></tr>");
tr.appendTo(table);
for (var j = 0; j < cellCount; j++) {
var field = data.columns[j].field;
var val="";
if (data.rows[i][field] != null)
{
val = data.rows[i][field];
}

var td = $("<td>" + val + "</td>");
td.appendTo(tr);
}
}
$("#createtable").append("</table>");
}

$(function () {
$("a[name=addRow]").click(function () {
$("#myTable tr:last").after(' <tr><td>Row4</td></tr>');
return false;
})
})

$(document).ready(function () {
//隐藏模板tr
$("#tb tr").eq(2).hide();
var i = 0;
$("#BtAdd").click(function () {
//复制一行
var tr = $("#tb tr").eq(2).clone();
tr.find("td").get(0).innerHTML = ++i;
tr.show();
tr.appendTo("#tb");
});
$("#BtDel").click(function () {
$("#tb tr:gt(2)").each(function () {
if ($(this).find("#CK").get(0).checked == true) {
$(this).remove();
}
});
i = 0;
$("#tb tr:gt(2)").each(function () {
$(this).find("td").get(0).innerHTML = ++i;
});
$("#CKA").attr("checked", false);
});
$("#CKA").click(function () {
$("#tb tr:gt(2)").each(function () {
$(this).find("#CK").get(0).checked = $("#CKA").get(0).checked;
});
});
})

$(function () {
$("#btnAdd").click(HandleUDFProperty);
function HandleUDFProperty() {
if ($("[tag='udfKey']").size() < 5) {
$("#udf_template").clone().find(":text").val("").end().find("a").click(function () {
$(this).parents('p').remove();
}).end().appendTo($("#UDFBlock"));
}
};

// 获取属性值
$("#btnGetValue").on("click", function () {
var keys = $("[tag='udfKey']"),
values = $("[tag='udfValue']"),
len = keys.length,
result = [],
txt = "";

for (var i = 0; i < len; i++) {
txt += "{key:" + keys.eq(i).val() + ", value:" + values.eq(i).val() + "},";
}

$("#result").text(txt);
});
})
</script>
</head>
<body>

</div>
</div>
</form>

<div id="UDFBlock">
<p id="udf_template">
<input id="CK" type="checkbox" name="CK" />
<input type="text" value="" tag="udfKey">
<input type="text" value="" tag="udfValue">
<a class="UDF_Delete" style="cursor:pointer">Delete</a>
</p>
</div>
<input type="button" id="btnAdd" value='Add' />
<input type="button" id="btnGetValue" value="Get Value" />
<div id="result">

</div>
</body>
</html>

jquery 对 table 的操作的更多相关文章

jquery对于table的操作
$("#datable tr").eq(0).children("td").eq(0).html() //获得某行某列的值
Visual Studio 2017中使用正则修改部分内容如何使用ILAsm与ILDasm修改.Net exe(dll)文件 C#学习-图解教程(1)：格式化数字字符串小程序开发之图片转Base64（C#、.Net） jquery遍历table为每一个单元格取值及赋值。net加密解密相关方法 .net关于坐标之间一些简单操作
Visual Studio 2017中使用正则修改部分内容最近在项目中想实现一个小工具,需要根据类的属性<summary>的内容加上相应的[Description]特性,需要实现的效 ...
【jQuery基础学习】04 jQuery中的表格操作及cookie插件的使用
这章本来准备写成jQuery的表单操作和表格操作的. 然而昨天吧jQuery的表单操作看完,发现全部在炒之前章节的剩饭,所以就没写出来. 那么今天就来看看表格吧. 因为平常做的都是公司的内部管理系统, ...
【学亮IT手记】Ajax跨域问题精讲--jQuery解决跨域操作
什么是跨域跨域,它是不同的域名(服务器)之间的相互的资源之间的访问. 当协议,域名,端口号任意一个不同,它们就是不同的域. 正常情况下,因为浏览器安全的问题,不同域之间的资源是不可以访问的. 跨域的 ...
[转]jQuery 选择器和dom操作
居然是12年的总结.... 文章地址: http://www.cnblogs.com/happyPawpaw/articles/2595092.html JQuery选择器 1.基本选择器基本选择器 ...
【Java EE 学习 33 上】【JQuery样式操作】【JQuery中的Ajax操作】【JQuery中的XML操作】
一.JQuery中样式的操作 1.给id=mover的div采用属性增加样式.one $("#b1").click(function(){ $("#mover" ...
JQuery中的DOM操作
JQuery中有很多DOM操作,但是因为之前没有总结过,所以用来用去都是那几个,一写html中的表单交互,尤其是那些复杂的表单交互,就是一大坨的js,我自己看着都费劲. 所以我感觉有必要总结一下 &l ...
Jquery基础之DOM操作
转自:http://www.cnblogs.com/bro-ma/p/3063942.html JQuery中的DOM操作主要对包括:建[新建].增[添加].删[删除].改[修改].查[查找][像数据 ...
jQuery -- DOM节点的操作
DOM 操作的分类: dom core: getElementById() getElementsByTagName() getAttribute() setAttribute() html-dom ...

随机推荐

LeetCode 8. String to Integer (atoi) （字符串到整数）
Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...
leetcode 217 Contains Duplicate 数组中是否有反复的数字
Contains Duplicate Total Accepted: 26477 Total Submissions: 73478 My Submissions Given an array o ...
2015南阳CCPC C - The Battle of Chibi DP树状数组优化
C - The Battle of Chibi Description Cao Cao made up a big army and was going to invade the whole Sou ...
yum install -y dos2unix
yum install -y dos2unix linux 怎么把^M去掉 - CSDN博客 http://blog.csdn.net/humanof/article/details/53044217 ...
速度上手LM4F LaunchPad 输出多路PWM波
最近转战到TI的Cortex M4平台后,发现网上关于TI的LM4F120 Launchpad 资料太少了,而且其中大部分都是TI员工或者其合作伙伴提供的,例程太少,导致新手上手很慢. 我只是要实现几 ...
Fiddler抓取https请求，解决“证书错误”警告
要抓取走HTTPS内容,Fiddler必须解密HTTPS流量. 但是,浏览器将会检查数字证书,并发现会话遭到窃听.为了骗过浏览器,Fiddler通过使用另一个数字证书重新加密HTTPS流量. Fid ...
Android中关于横竖屏问题
一.屏幕的方向可以在AndroidManifest.xml文件中通过设置screenOrientation属性来实现, screenOrientation用来指定Activity的在设备上显示的方向, ...
第一章、Tiny4412 U-BOOT移植一说明【转】
本文转载自:http://blog.csdn.net/eshing/article/details/37520291 一.移植前说明: 1. 特别声明:此文档是我的学习文档,里面肯定有错误地方,仅供 ...
CDOJ 1330 柱爷与远古法阵（高斯消元）
CDOJ 1330 柱爷与远古法阵(高斯消元) 柱爷与远古法阵 Time Limit: 125/125MS (Java/Others) Memory Limit: 240000/240000K ...
C#在WinForm中使用WebKit传递js对象实现与网页交互的方法
这篇文章主要介绍了C#在WinForm中使用WebKit传递js对象实现与网页交互的方法,涉及针对WebBroswer控件及WebKit控件的相关使用技巧,需要的朋友可以参考下本文实例讲述了C#在W ...

jquery 对 table 的操作

jquery 对 table 的操作的更多相关文章

随机推荐

热门专题