css的选择器 nth-child(N) 用于匹配属于其父元素的第 N 个子元素，因此获取table的某列可用如下核心代码
1
$("table tr")find("td:nth-child(n)"); // 获取table所有行第一列
实例演示：点击按钮获取第一列中含有字符1的行标
创建Html元素
1
2
3
4
5
6
7
8
9
10
11
<div class="box">
<span>点击按钮获取第一列中含有字符1的行标：</span>
<div class="content">
<table class="test">
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>4</td><td>5</td><td>6</td></tr>
<tr><td>71</td><td>8</td><td>9</td></tr>
</table>
</div>
<input type="button" value="获取第一列含有字符1的行">
</div>
设置css样式
1
2
3
4
5
divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
divbox>span{color:#999;font-style:italic;}
divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
table{border-collapse:collapse;}
td{width:30px;height:30px;line-height:30px;text-align:center;border:1px solid green;}
编写jquery代码
1
2
3
4
5
6
7
8
$(function(){
$("input:button")click(function() {
num = $("tabletest tr")find("td:nth-child(1)")map(function(index, elem) {
return $(elem)html()indexOf("1")>=0 index+1 : null;
})get()join(',');
alert("第一列中包含字符1的行为："+num);
});
});
css的选择器 nth-child(N) 用于匹配属于其父元素的第 N 个子元素，因此获取table的某列可用如下核心代码
$("table tr")find("td:nth-child(n)"); // 获取table所有行第一列实例演示：点击按钮获取第一列中含有字符1的行标
创建Html元素
<div class="box"><span>点击按钮获取第一列中含有字符1的行标：</span><br>
<div class="content">
<table class="test">
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>4</td><td>5</td><td>6</td></tr>
<tr><td>71</td><td>8</td><td>9</td></tr>
</table>
</div>
<input type="button" value="获取第一列含有字符1的行">
</div>
设置css样式
divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}divbox>span{color:#999;font-style:italic;}
divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
table{border-collapse:collapse;}
td{width:30px;height:30px;line-height:30px;text-align:center;border:1px solid green;}
编写jquery代码
$(function(){$("input:button")click(function() {
num = $("tabletest tr")find("td:nth-child(1)")map(function(index, elem) {
return $(elem)html()indexOf("1")>=0 index+1 : null;
})get()join(',');
alert("第一列中包含字符1的行为："+num);
});
});
观察效果
<!-- 下面代码放到同一个html中，打开就可以有效果了 -->
<!DOCTYPE HTML>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<table id="tabone">
<tr>
<td><input type="checkbox" /></td>
<td>编号</td>
<td>名称</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>1</td>
<td>蜡笔小新</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>2</td>
<td>小丸子</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>3</td>
<td>动感超人</td>
</tr>
</table>
<a href="javascript:choosetr()">选择</a>
<table id="tabtwo">
</table>
</body>
</html><script src=">
这只是其中一种做法，方法还有很多，楼上两位的也可以。
主要是看怎么拼的好。
var aaa="";
jQuery("#table tr")each(function (i){//循环行
if(i==jQuery("#table tr")length-1)//判断最后一行
{
aaa+=jQuery("#table tr input")val();
}
else{
aaa+= jQuery("#table tr:eq("+i+") select")val()+":";//取到每行下拉框的值
jQuery("#table tr:eq("+i+") input[type=text]")each(function (){
aaa+=thisvalue+",";
});
aaa+="--";//此行结束
}
});
以上就是关于jquery怎样获得table里某列的值全部的内容，包括:jquery怎样获得table里某列的值、jquery 怎样获得table里某列的值、Jquery获取Table中的原始 复制成另外的Table等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）