jQuery操作表单(表)的常用方法和技巧的总结
下面是13个jQuery操作表常用的函数:1。鼠标移动线变色
复制代码代码如下:$(' # Table1 TR)。Hover(function(){)
$(这)。儿童('td)。AddClass('hover)
}函数(){()
$(这)。儿童('td)。RemoveClass('hover)
});
方法二:
复制代码代码如下所示:
$(# Table1 TR:GT(0))。Hover(function(){)
$(这)。儿童(TD),AddClass(悬停);
}函数(){()
$(这)。儿童(TD),RemoveClass(悬停);
});
2。奇数行和偶数行的不同颜色
复制代码代码如下:(表1美元的# TBODY TR:奇),Css('background-color ',' # BBF');
(表1美元的# TBODY TR:即使)。Css('background-color ',' # FFC);
类
$(# Table1 TBODY TR:奇),AddClass(奇);
$(# Table1 TBODY TR:即使)。AddClass(连);
三.隐藏一个线
复制代码代码如下所示:
(表1美元的# TBODY TR:情商(3)')隐藏();
$(# Table1 TR TD::nth-child(3))藏();
$(# Table1 TR(每个)(功能){ $(TD:情商(3),这(隐藏))});
4。隐藏一列
复制代码代码如下:$(' # Table1 TR TD::nth-child(3)')隐藏();
5。删除一行
将代码复制如下:除第一行之外删除所有行。
$(# Table1 TR:不(:第一))删除();
删除指定行
$(# Table1 TR:情商(3))删除();
6。删除一列
将代码复制如下:在所有列之外删除第一列
$(# Table1 TR:不(:nth-child(1)))删除();
$(# Table1 TR TD:不(:nth-child(1)))删除();
第一列/删除
$(# Table1 TR TD::nth-child(1))删除();
7。获取(设置)单元格的值
复制代码如下: / /套表,第一TD二TR值。
$(# Table1 TR:情商(1)TD:nth-child(1))。Html(币值);
/ /表,第一TD二TR值。
$(# Table1 TR:情商(1)TD:nth-child(1))。Html();
8。插入一行
将代码复制如下:
(3美元'insert插入插入)。InsertAfter($(' #表7 TR:情商(1)'));
9。获取每个行指定的单元格的值。
复制代码如下:var arr = { };
$(# Table1 TR TD:nth-child(1))。每个(功能(键,值){)
Arr.push($(this)。Html());
});
VaR结果= arr.join(',');
10。选择或取消选择
复制代码代码如下所示:
零/ 方法:
$(#所有),(听到咔哒声,函数()){
$(输入。checksub)。道具('checked ',这个检查); / /绑定子选择添加效果
});
方法:
选择或取消选择/参数的输入事件,如:检查(事件)
功能检查(EVT){
EVT = evtevt:window.event;
VaR是= EVT。targetevt。目标:evt.srcelement;
var = $(# TBL表);
无功trlist = tbl.find(TR);
对于(var i = 1;i < trlist.length;i++){
TR = $(var trlist {我});
无功输入= tr.find(输入{类型= 'checkbox});
Input.attr(查看
}
}
两种方法:
选择或取消选择/参数传入这个如:检查(这)
功能检查(EVT){
var = $(# TBL表);
无功trlist = tbl.find(TR);
对于(var i = 1;i < trlist.length;i++){
TR = $(var trlist {我});
无功输入= tr.find(输入{类型= 'checkbox});
Input.attr(查看
}
}
三 /方法:
选择或取消选择/参数传入这个如:检查(这)
功能检查(EVT){
$(# Table1 TR),(输入{类型= 'checkbox})。每个(功能(我){ {)
$(这)。Attr(查看
});
}
四 /方法:
选择或取消选择/参数传入这个如:检查(这)
功能检查(EVT){
$(# Table1 TR),(输入{类型= 'checkbox})。Attr(查看
}
11。客户端动态添加行
复制代码代码如下所示:
功能btnaddrow(){
行号从0开始,最后一行是添加,删除,保存按钮为减号2。
VaR rownum = $(# TR邻接表);
VaR CHK = ;
var text;
男女;
无功行= + + CHK+文字+ +选择++文本+
$(行)。InsertAfter(# Table1 TR:情商(+行号+))))
}
12。客户端删除一行
复制代码代码如下所示:
在删除多行时,只能一次删除一行并出错。
功能btndeleterow(){
$(# Table1 TR),(输入{类型= 'checkbox})。每个(功能(我){ {)
如果($(this)。Attr(检查)){
如果(i)!= 0){无法删除行标头
$(# Table1 TR:情商(+我+ ))删除();
}
}
});
}
这比上面的更好,并且可以删除多个记录。
功能btndeleterow(){
$(# Table1 TR)。每个(功能(我){)
VaR CHK =美元(这)找到(输入{类型= 'checkbox});
如果(chk.attr(ID)!=检查){ / /不能删除标题行
如果(chk.attr(检查)){
美元(这个);
}
}
});
}
13。客户端保存
复制代码代码如下所示:
功能btnsaveclick(){
在{查找/查找}方法中,我不知道如何设置多个筛选条件,因此没有选择列表的值。
/ / $(# Table1 TR TD)。找到(输入{类型}中的| | 选择(每个)功能(我){
警告($(this))瓦迩());
/