关于一个很纠结的jQuery获取table子控件数据的问题

wangzhen199009 2012-10-13 12:19:47
有一个五行五列的table,代码如下:

<table width="385" height="370" border="3">
<tr>
<td width="41"> </td>
<td width="65">A</td>
<td width="69">B</td>
<td width="82">C</td>
<td width="90">D</td>
</tr>
<tr>
<td>A</td>
<td>1</td>
<td><select class="s1"><option>1</option><option>2</option><option>3</option></select></td>
<td><select class="s1"><option>1</option><option>2</option><option>3</option></select>;</td>
<td><select class="s1" name="select">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
</tr>
<tr>
<td>B</td>
<td> </td>
<td>1</td>
<td><select class="s1" name="select2">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
<td><select class="s1" name="select3">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
</tr>
<tr>
<td>C</td>
<td> </td>
<td> </td>
<td>1</td>
<td><select class="s1" name="select4">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
</tr>
<tr>
<td>D</td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
</tr>
</table>


这个表的特点是:只有对角线右上select控件,对角线全是1,下三角空。select控件都是有class属性的。
有两个问题:
1.如果我选定某行i某列j中的某一个select控件(i=3,j=5,行列数均从1开始),如何确定“前面”所有的select控件数量。“前面”只得是以行有限原则遍历,直到遍历到选中的select。

2.如何获取选中的select所在列的表头文字。
...全文
214 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
wangzhen199009 2012-10-13
  • 打赏
  • 举报
回复
[Quote=引用 1 楼 的回复:]
HTML code
<script type="text/javascript" src="http://www.coding123.net/js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$('select').change(function(){
var sel=$(this)
……
[/Quote]
看了你的头像发现还是当爹的程序员最有魅力啊!谢谢啊,jQ刚刚学,多谢指点,果断结贴。
Go 旅城通票 2012-10-13
  • 打赏
  • 举报
回复
<script type="text/javascript" src="http://www.coding123.net/js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$('select').change(function(){
var sel=$(this)
,td=sel.parent()
,table=td.closest('table')
,headTR=table.find('tr:first')//表头对象
cellIndex=td.get(0).cellIndex//所在列
,totalSel=0;
sel=sel.get(0)
table.find('select').each(function(){
if(this==sel)return false;
totalSel++;
});
alert('前面的select数量:'+totalSel)
alert('表头:'+headTR.find('td:eq('+cellIndex+')').html())
});
});
</script>
<table width="385" height="370" border="3">
<tr>
<td width="41"> </td>
<td width="65">A</td>
<td width="69">B</td>
<td width="82">C</td>
<td width="90">D</td>
</tr>
<tr>
<td>A</td>
<td>1</td>
<td><select class="s1"><option>1</option><option>2</option><option>3</option></select></td>
<td><select class="s1"><option>1</option><option>2</option><option>3</option></select></td>
<td><select class="s1" name="select">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
</tr>
<tr>
<td>B</td>
<td> </td>
<td>1</td>
<td><select class="s1" name="select2">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
<td><select class="s1" name="select3">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
</tr>
<tr>
<td>C</td>
<td> </td>
<td> </td>
<td>1</td>
<td><select class="s1" name="select4">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
</tr>
<tr>
<td>D</td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
</tr>
</table>

52,799

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 Ajax
社区管理员
  • Ajax
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧