正文
jquery行一行,jquery增加一行
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
jquery 选择表格中的一行
$("#maintable td").click(function(){
var row = $(this).parent("tr").prevAll().length+1;
var colum = $(this).prevAll().length+1;
alert('选中的是第'+row+'行，第'+colum+'列。');
$(this).parent("tr").attr("style","background-color:#FF0000");
});
相关问答
Q1: 用jquery怎么获取表格中的一行内容
一般都会在后台获得，比如这个表格的数据是用$list这个变量存储的，$list中每个元素都有id date title file四个字段，checkbox的name是id，现在写一个js方法用来将选中的复选框传到后台，需要使用一个按钮触发下面的方法
function fun(){
var arr = new Array();
$(":checked").each(function(){
arr[] = $(this).attr("name");
});
//然后用任意方法将arr传到后台
}
在后台根据传回来的id在$list中获得要你想要的数据。
上面是我觉得最简单的方法。
下面还有一个在页面里获得你要的数据的方法
将每一行数据都写在同一个div里，根据复选框的标示获得对应div内的数据
div name=“id”数据， （最后一列）input type="checkbox" name="id" //div
script
function fun(){
var arr = new Array();
var name = '';
$(":checked").each(function(){
name = $(this).attr("name");
arr[] = $("div[name=" + name + "]").html();
});
}
/script
Q2: 如何通过jquery动态给表格添加一行？
比如设置table的id为tab
var trHTML = "trtd.../td/tr"
$("#tab").append(trHTML);//在table最后面添加一行
$("#tab tr:eq(2)").after(trHTML); // 在table的第3行后面添加一行这样就可以进行动态的添加行了，至于你是通过什么事件来动态添加那就看你自己的意思了，通过button或者div之类的点击事件添加，只要把上面的两行代码放进去就ok，注意，要把var trHTML那行代码放进添加事件里面，不然不管点击多少下，都只能添加一行
$(function() {
$(":button").click(function() {
var tr = "trtdnew/td/tr";
//$("table").append(tr);
$("table tr:eq(2)").after(tr);
});
});
这是我测试用的代码，你可以运行看看
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（ 或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
jQuery的模块可以分为：入口模块、底层支持模块和功能模块。其核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。
Q3: JQUERY方法给TABLE动态增加行
1、首先输入下方的代码：
%@ page language="java" pageEncoding="UTF-8"%
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
html
head
title利用jquery给指定的table添加一行、删除一行/title
meta http-equiv="pragma" content="no-cache"
meta http-equiv="cache-control" content="no-cache"
meta http-equiv="expires" content="0"
meta http-equiv="keywords" content="keyword1,keyword2,keyword3"
meta http-equiv="description" content="This is my page"
script type="text/javascript"
src="%=request.getContextPath()%/js/jquery-1.5.1.js"/script
script type="text/javascript"
2、然后在输入下方的代码：
////////添加一行、删除一行封装方法///////
/**
* 为table指定行添加一行
*
* tab 表id
* row 行数，如：0-第一行 1-第二行 -2-倒数第二行 -1-最后一行
* trHtml 添加行的html代码
*
*/
function addTr(tab, row, trHtml){
//获取table最后一行 $("#tab tr:last")
//获取table第一行 $("#tab tr").eq(0)
//获取table倒数第二行 $("#tab tr").eq(-2)
var $tr=$("#"+tab+" tr").eq(row);
if($tr.size()==0){
alert("指定的table id或行数不存在！");
return;
}
$tr.after(trHtml);
}
3、然后在输入下方的代码：
function delTr(ckb){
//获取选中的复选框，然后循环遍历删除
var ckbs=$("input[name="+ckb+"]:checked");
if(ckbs.size()==0){
alert("要删除指定行，需选中要删除的行！");
return;
}
ckbs.each(function(){
$(this).parent().parent().remove();
});
}
/**
* 全选
*
* allCkb 全选复选框的id
* items 复选框的name
*/
function allCheck(allCkb, items){
$("#"+allCkb).click(function(){
$('[name='+items+']:checkbox').attr("checked", this.checked );
});
}
////////添加一行、删除一行测试方法///////
$(function(){
//全选
allCheck("allCkb", "ckb");
});
function addTr2(tab, row){
var trHtml="tr align='center'td width='30%'input type='checkbox' name='ckb'/
/tdtd width='30%'地理/tdtd width='30%'60/td/tr";
addTr(tab, row, trHtml);
}
function delTr2(){
delTr('ckb');
}
4、然后输入下方的代码：
/script
/head
body
table border="1px #ooo" id="tab" cellpadding="0"
cellspacing="0" width="30%"
tr align="center"
td width="30%"input id="allCkb" type="checkbox"//td
td width="30%"科目/td
td width="30%"成绩/td
/tr
tr align="center"
td width="30%"/td
td width="30%"语文/td
td width="30%"80/td
/tr
/table
input type="button" onclick="addTr2('tab', -1)" value="添加"
input type="button" onclick="delTr2()" value="删除"
/body
/html
5、然后这样就完成了。
