A. js获得table行中列的值,就是checkbox如何获得选中那个获得相应的值
你可以使用 javaScript 中自带的 rowIndex 和 cellIndex 来获取行和列的键值 (从0开始)
点击 checkbox,获取 parentNode (也就是 td),td.cellIndex 就是所在列的键值
点击 checkbox,获取 parentNode.parentNode (也就是 tr),tr.rowIndex 就是所在行的键值
<script type="text/javascript">
// 点击
document.onclick = function(e) {
// 兼容 event 和 target
e = e || window.event;
var target = e.target || e.srcElement;
// 确认是 checkbox
if(target.tagName.toLowerCase() === "input"
&& target.type === "checkbox") {
// 获取行列键值
var row_num = target.parentNode.parentNode.rowIndex;
var col_num = target.parentNode.cellIndex;
// 输出
alert(row_num + " " + col_num);
}
};
</script>
因为键值是从 0 开始,一般需要 +1 才是行列数,但因为你表单中第一行个第一列都是文字,所以不需要 +1 正好输出需要的数字,例如点击周四 + 6,会输出 4 6
B. js获取table当前tr行第二列td的值
在a标签上写个class,用jq写的
$(".a标签的class").click(function(){
var text = $(this).parent("td").siblings("td").text();
alert(text)
})
C. 在js中怎样获取当前页面表格中的数据
1、JS获取表格的简便方法:获取tbody:tBodies 获取thead:tHead 获取tfoot:tFoot 获取行tr:rows 获取列td:cells
使用实例: oTable.tBodies[0] oTable.tHead[0] oTable.tFoot[0] oTable.rows[1] oTable.cells[1]
2、遍历
var oTable=document.getElementById("表格id");
oTable.tBodies[0]可以看成是rows和cells组成的二维数组,用两个for循环嵌套遍历一下就可以了
D. 如何用javascript获取表格中一行的值
1、简单的,表格中的一行添加id属性
varitem=document.getElementById("id");
2、在行本身绑定方法将自身作为参数传递
<html>
<head>
<scripttype='text/javascript'>
varcurRow; //全局行号
varcurRowId;//选中行的记录信息的ID
varcurColor;
functionselectRow(tr){//tr行本身
curRow=tr;
curRowId=tr.id;
alert(tr.cells[0].innerText);
}
</script>
</head>
<bodyonload="javascript:selectRow(1)">
<tableborder="1solid">
<tronclick="selectRow(this);">
<td>001</td>
<td>google</td>
</tr>
<tronclick="selectRow(this);">
<td>002</td>
<td></td>
</tr>
</table>
</body>
</html>
3、获取所有行集合,然后通过下标访问某一行
varitems=document.getElementByTagName("tr");
//获取某一行(下标从0开始,到items.length-1结束)
varhang=items[0];
E. js怎么获取表格中指定行某一列的值
jQuery 遍历的 eq() 方法将匹配元素集缩减值指定 index 上的一个,index表示元素的位置(最小为 0)。所以获取Table第 i 行第 j 列的内容可用如下代码
$("table").find("tr").eq(i-1).find("td").eq(j-1).text(); // 注意-1是因为index从0开始计数。
F. jsp,js如何获取table的当前行的某单元格的值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>动态表格</title>
</head>
<body>
<p>动态表格彻底研究</p>
<p>对表格单元格的添加删除修改并对其进行移动以及拷贝等操作,是目前应用开发中常用的技术</p>
<p>
<input type="button" name="Submit" value="刷新" onclick="onRefresh()" />
<input type="button" name="Submit2" value="全选" onclick="selectall()"/>
<input type="button" name="Submit8" value="反选" onclick="inverse()" />
<input type="button" name="Submit3" value="不选" onclick="noselect()"/>
<input type="button" name="Submit4" value="添加行与列" onclick="insert_row()" />
<input type="button" name="Submit7" value="删除选择" onclick="delRow()" />
<input type="button" name="Submit5" value="拷贝选择" onclick="Row()"/>
<input type="button" name="Submit92" value="居中对齐" onclick="tableAlign()"/>
<input type="button" name="Submit922" value="隔行变色" onclick="changeColor()"/>
</p>
<table width="50%" border="1" cellpadding="1" cellspacing="2" bordercolor="#CCCCCC" id="myTable">
<tr>
<td width="7%">
<label>
<input type="checkbox" name="checkbox" value="checkbox" />
</label> </td>
<td width="51%">1</td>
<td width="14%">1</td>
<td width="14%">1</td>
<td width="14%">1</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox2" value="checkbox" /></td>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox3" value="checkbox" /></td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox4" value="checkbox" /></td>
<td>4</td>
<td>4</td>
<td>4</td>
<td>4</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox5" value="checkbox" /></td>
<td>5</td>
<td colspan="2">55</td>
<td>5</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox6" value="checkbox" /></td>
<td>6</td>
<td>6</td>
<td>6</td>
<td>56</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox7" value="checkbox" /></td>
<td>777</td>
<td>7</td>
<td>77</td>
<td>7</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox8" value="checkbox" /></td>
<td>88</td>
<td>8</td>
<td>88</td>
<td>77</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox9" value="checkbox" /></td>
<td>999</td>
<td>99</td>
<td>99</td>
<td>999</td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox10" value="checkbox" /></td>
<td>10</td>
<td>10</td>
<td>10</td>
<td>10</td>
</tr>
</table>
<br />
<p></p>
<script type="text/javascript">
var form = document.forms["form1"];
var table = document.getElementById("myTable");
var selectBox = table.getElementsByTagName("input");
var tr = table.getElementsByTagName("tr");
var clicked = true;
function insert_row(){
//alert(table.rows[0].cells.length)
var thisrow = table.insertRow(0);
var thiscell = thisrow.insertCell(0);
thiscell.innerHTML = "<input type="checkbox" name="checkbox10" value="checkbox" />";
var thiscell1 = thisrow.insertCell(1);
thiscell1.innerHTML = "cell";
var thiscell2 = thisrow.insertCell(2);
thiscell2.innerHTML = "cell";
var thiscell3 = thisrow.insertCell(3);
thiscell3.innerHTML = "cell";
var thiscell4 = thisrow.insertCell(4);
thiscell4.innerHTML = "cell";
thiscell4.align = "center";
}
function insert_Cell(){
var y = table.rows[0].insertCell(0);
y.colSpan="2";
y.innerHTML = "sssss";
}
function selectall(){
for(i=0;i<selectBox.length;i++){
selectBox[i].checked = true;
}
}
function noselect(){
for(i=0;i<selectBox.length;i++){
selectBox[i].checked = false;
}
}
function inverse(){
for(i=0;i<selectBox.length;i++){
if(selectBox[i].checked){
selectBox[i].checked = false;
}else{
selectBox[i].checked = true;
}
}
}
function delRow(){
for(i=selectBox.length-1;i>=0;i--){
//alert(typeof(selectBox[i]));
if(selectBox[i].checked){
table.deleteRow(i);
}
}
}
function onRefresh(){
location.reload();
}
function Row(){
for(i=0;i<selectBox.length;i++){
if(selectBox[i].checked){
//var table = document.getElementById("Table");
var tablerow = table.insertRow(table.rows.length);
tablerow.innerHTML = table.rows[i].innerHTML;
}
}
}
function tableAlign(){
for(i=0;i<selectBox.length;i++){
if(selectBox[i].checked && clicked){
table.rows[i].align = "center";
}
}
}
function changeColor(){
var skip = true;
for(i=0;i<tr.length;i++){
if(skip){
tr[i].bgColor = "#cccccc";
skip = false;
}else{
tr[i].bgColor = "#ffffff";
skip = true;
}
}
}
</script>
</body>
</html>
运行效果:
G. js获取table里面<tr>一整行的信息
给tr一个id,然后获取
//XX是id,string是获得的值
var row = document.getElementById('XX');
var string = row.innerHTML;
H. js 通过td的id值 如何拿到tr的id值(动态获取)
错误出在document.getElementById(dd)
因为页面上id为2的出现了多个,而这样获取只会取到第一个,所以tr始终为相应的第1个.
按照你的写法,用dd来保存tr的行数比较好,即i值。
然后通过document.all.table1.rows(i).id来获取tr的id值。
I. 怎么用JavaScript获取table某行数据
表格的第一行为thead中的th
剩下的数据放到tbody中
最后那一行添加的放到tfoot中
对tbody下面的所有tr绑定一个点击事件
事件中获取这个tr下的所有td,就可以获取这行的数据了
大概代码如下:
var trs =document.getElementById("tbodyId").getElementsByTagName("tr");
for(int i=0;i<=trs.length;i++)
{
var tr = trs[i];
var tds=tr.getElementsByTagName("td");
//下面遍历tds就可以去获取数据了
//把数据放到下面的表单就好了
//然后提交数据,在服务端进行修改
}