根據(jù)你的html,幫你寫了段代碼.獲取的值存到三個(gè)數(shù)組中.
在禹王臺(tái)等地區(qū),都構(gòu)建了全面的區(qū)域性戰(zhàn)略布局,加強(qiáng)發(fā)展的系統(tǒng)性、市場(chǎng)前瞻性、產(chǎn)品創(chuàng)新能力,以專注、極致的服務(wù)理念,為客戶提供網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站建設(shè) 網(wǎng)站設(shè)計(jì)制作按需策劃,公司網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),品牌網(wǎng)站制作,營(yíng)銷型網(wǎng)站建設(shè),成都外貿(mào)網(wǎng)站制作,禹王臺(tái)網(wǎng)站建設(shè)費(fèi)用合理。
我是根據(jù)對(duì)象的class屬性來獲取對(duì)象.進(jìn)行獲取對(duì)象的值或?qū)傩?
jquery的選擇器非常強(qiáng)大,有非常多的選擇對(duì)象的方式,這只是其中一種.
你可以找到更多的方法來達(dá)到你的目的.
html
meta http-equiv="Content-type" content="text/html; charset=utf-8" /meta
head
title
demo
/title
script src="jquery.js" type="text/javascript"/script
script
var date_arr = new Array();
var chk_arr = new Array();
var input_arr = new Array();
function get_td_value(){
$(".date").each(function(){
date_arr.push( $(this).text());//存入數(shù)組中.
});
alert(date_arr.length);
}
function get_check_value(){
$(".chk").each(function(){
if($(this).attr('checked')) chk_arr.push( $(this).attr('id'));
});
alert(chk_arr.length);
}
function get_input_value(){
$(".for_input").each(function(){
input_arr.push( $(this).val());
});
alert(input_arr.length);
}
/script
/head
body
div id="showTime"
table class='itable' width='100%' id='timetable'
tr
th日期/th
th選中 input id="checkAll" type="checkbox" //th
th人數(shù)限制/th
/tr
tr
td align="center" class="date"2010-4-1/td
td align="center" input id="cb1" name="checkbox_name" type="checkbox" class="chk" //td
td align="center"input id="txt1" type="text" name="text" class="for_input"http://td
/tr
tr
td align="center" class="date"2010-4-2/td
td align="center" input id="cb2" name="checkbox_name" type="checkbox" class="chk" //td
td align="center"input id="txt2" type="text" name="text" class="for_input"http://td
/tr
tr
td align="center" class="date"2010-4-3/td
td align="center" input id="cb3" name="checkbox_name" type="checkbox" class="chk"http://td
td align="center"input id="txt3" type="text" name="text" class="for_input"http://td
/tr
tr
td align="center"input value="第一列" type="button" onclick="get_td_value();"/td
td align="center"input value="第二列" type="button" onclick = "get_check_value();"/td
td align="center"input value="第三列" type="button" onclick = "get_input_value();"/td
/tr
/table
/div
/body
/html
script?language="jscript"?type="text/javascript"?
var?pageIndex?=?1;?//當(dāng)前頁(yè)數(shù)?
$(function(){?
GetPageCount();//獲取分頁(yè)數(shù)量以及總的記錄條數(shù)?
$("#load").hide();//隱藏loading提示?
$("#template").hide();//隱藏模板?
ChangeState(0,1);//設(shè)置翻頁(yè)按鈕的初始狀態(tài)?
bind();//綁定第一頁(yè)的數(shù)據(jù)?
//第一頁(yè)按鈕click事件?
$("#first").click(function(){?
pageIndex?=?1;?
ChangeState(0,1);?
bind();?
});?
//上一頁(yè)按鈕click事件?
$("#previous").click(function(){?
pageIndex?-=?1;?
ChangeState(-1,1);?
if(pageIndex?=?1){?
pageIndex?=?1;?
ChangeState(0,-1);?
}?
bind();?
});?
//下一頁(yè)按鈕click事件?
$("#next").click(function(){?
pageIndex?+=?1;?
ChangeState(1,-1);?
if(pageIndex=pageCount)?
{?
pageIndex?=?pageCount;?
ChangeState(-1,0);?
}?
bind(pageIndex);?
});?
//最后一頁(yè)按鈕click事件?
$("#last").click(function(){?
pageIndex?=?pageCount;?
ChangeState(1,0);?
bind(pageIndex);?
});?
//每頁(yè)顯示記錄條數(shù)select事件?
$("#pageSize").change(function(){?
bind();?
})?
});?
//AJAX方法取得數(shù)據(jù)并顯示到頁(yè)面上?
function?bind(){?
$("#load").show();?
var?pageSize?=?$("#pageSize").val();?
$.ajax({?
type:?"get",//使用get方法訪問后臺(tái)?
dataType:?"json",//返回json格式的數(shù)據(jù)?
url:?"%=basePath%actionSmUser.do?method=listUser2",//要訪問的后臺(tái)地址?
data:?"pageIndex="?+?pageIndex+"pageSize="+pageSize,//要發(fā)送的數(shù)據(jù)?
complete?:?function(msg){//msg為返回的數(shù)據(jù),在這里做數(shù)據(jù)綁定?
$("[id=ready]").remove();?
var?data?=?eval("("+msg.responseText+")");?
$.each(data,?function(i,?n){?
var?row?=?$("#template").clone();?
row.find("#userId").text(n.userId);?
row.find("#userName").text(n.userName);?
row.find("#depId").text(n.depId);?
row.find("#createTime").text(n.createTime);?
if(n.createTime?!==?undefined)?row.find("#createTime").text(n.createTime);?
row.find("#creator").text(n.creator);?
row.find("#menusId").text(n.menusId);?
row.find("#isValid").text(n.isValid);?
row.attr("id","ready");//改變綁定好數(shù)據(jù)的行的id?
row.appendTo("#datas");//添加到模板的容器中?
});?
$("[id=ready]").show();?
SetPageInfo();?
}?
});?
}?
function?ChangeDate(date){?
return?date.replace("-","/").replace("-","/");?
}?
//設(shè)置第幾頁(yè)/共幾頁(yè)的信息?
function?SetPageInfo(){?
var?pageCount?=?$("#pageCount").val();?
var?totalCount?=?$("#totalCount").val();?
var?pageSize?=?$("#pageSize").val();?
$("#pageinfo").html("?第input?class='default_pgCurrentPage'?id='pageIndex'?type='text'?value='"+pageIndex+?
"'?style='width:?30px'?/?頁(yè)"?+?"/"?+"共?"+pageCount+"頁(yè)"+?
"?檢索到?"+totalCount+"條記錄,顯示第?"+(pageIndex*pageSize-pageSize)+"?條?-?第?"+(pageIndex*pageSize)+"?條記錄");?
}?
//AJAX方法取得分頁(yè)總數(shù)?
function?GetPageCount(){?
var?pageSize?=?$("#pageSize").val();?
$.ajax({?
type:?"get",?
dataType:?"text",?
url:?"%=basePath%actionSmUser.do?method=getPageCount",?
data:?"pageSize="+pageSize?,?
async:?false,?
success:?function(msg){?
var?data?=?eval("("+msg+")");?
$("#pageCount").val(data[0].pageCount);?
$("#totalCount").val(data[0].totalCount);?
}?
});?
}?
//改變翻頁(yè)按鈕狀態(tài)?
function?ChangeState(state1,state2){?
$("#first").attr("class","default_pgFirst?default_pgBtn");?
$("#previous").attr("class","default_pgPrev?default_pgBtn");?
$("#next").attr("class","default_pgNext?default_pgBtn");?
$("#last").attr("class","default_pgLast?default_pgBtn");?
if(state1?==?1)?{?
document.getElementById("first").disabled?=?"";?
document.getElementById("previous").disabled?=?"";?
}else?if(state1?==?0){?
document.getElementById("first").disabled?=?"disabled";?
document.getElementById("previous").disabled?=?"disabled";?
$("#first").attr("class","default_pgFirstDisabled?default_pgBtn");?
$("#previous").attr("class","default_pgPrevDisabled?default_pgBtn");?
}if(state2?==?1){?
document.getElementById("next").disabled?=?"";?
document.getElementById("last").disabled?=?"";?
}else?if(state2?==?0){?
document.getElementById("next").disabled?=?"disabled";?
document.getElementById("last").disabled?=?"disabled";?
$("#next").attr("class","default_pgNextDisabled?default_pgBtn");?
$("#last").attr("class","default_pgLastDisabled?default_pgBtn");?
}?
}?
/script?
html頁(yè)面代碼如下:?
復(fù)制代碼代碼如下:
body?
div?
div?
br?/?
table?id="datas"?align="center"?class="listtable"?width="100%"?bgcolor="#CCCCCC"?cellSpacing="1"?cellpadding="1"?style="margin-top:5px;"?
tr?class="fixheader"?
th?width="14%"?
用戶ID/th?
th?width="14%"?
用戶名稱/th?
th?width="14%"?
所在科室/th?
th?width="14%"?
創(chuàng)建時(shí)間/th?
th?width="14%"?
創(chuàng)建人/th?
th?width="14%"?
菜單集名稱/th?
th?width="14%"?
是否有效/th?
/tr?
tr?id="template"?height="22px"?bgcolor="#F9FDFF"?onmouseover="javascript:this.style.backgroundColor='#FFFFCC';?return?true;"?onMouseOut="javascript:this.style.backgroundColor='#F9FDFF';?return?true;"?
td?id="userId"?class="tdc"?
/td?
td?id="userName"?class="tdc"?
/td?
td?id="depId"?class="tdc"?
/td?
td?id="createTime"?class="tdc"?
/td?
td?id="creator"?class="tdc"?
/td?
td?id="menusId"?class="tdc"?
/td?
td?id="isValid"?class="tdc"?
/td?
/tr?
/table?
/div?
div?id="load"?style="left:?0px;?position:?absolute;?top:?0px;?background-color:?red"?
LOADING....?
/div?
div?class="default_pgContainer"??
div?class="default_container"?
div?class="default_pgPanel"?id="skinDiv"?
table?class="default_pgToolbar"?
tr?
td?class="black_pgCurrentPage"?
select?id="pageSize"?name="pageSize"?
option?selected="selected"?value="10"10/option?
option?value="20"20/option?
option?value="30"30/option?
/select?
/td?
td?
div?id="first"?class="default_pgFirst?default_pgBtn"?/?
/td?
td?
div?id="previous"?class="default_pgPrev?default_pgBtn"?/?
/td?
td?class="default_separator"?
/td?
td?
div?id="next"?class="default_pgNext?default_pgBtn"?/?
/td?
td?
div?id="last"?class="default_pgLast?default_pgBtn"?/?
/td?
td?class="default_separator"?
/td?
td?
span?id="pageinfo"/span?
/td?
/tr?
/table?
/div?
/div?
/div?
/div?
div?id="test"/div?
input?type="hidden"?id="pageCount"?style="width:?45px"?/?
input?type="hidden"?id="totalCount"?style="width:?45px"?/?
/body?
后臺(tái)action中代碼如下:?
復(fù)制代碼代碼如下:
//分頁(yè)獲取用戶信息?
public?void?listUser2(ActionMapping?mapping,?ActionForm?form,?
HttpServletRequest?request,?HttpServletResponse?response){?
RequestTool?tool?=?new?RequestTool(request);?
Integer?pageSize?=?tool.getIntParameter("pageSize");?
Integer?pageIndex?=?tool.getIntParameter("pageIndex");?
ResultPage?res?=?serviceSmUserImpl.findAllSmUsers(pageIndex,?pageSize);?
ListSmUser?smUserList?=?(ListSmUser)res.getResult();?
JSONArray?array?=?new?JSONArray();?
JSONObject?object?;?
for(SmUser?user:smUserList){?
object?=?new?JSONObject();?
object.put("userId",?user.getUserId());?
object.put("userName",user.getUserName());?
object.put("depId",?user.getOrganCode());?
object.put("createTime",?user.getCreateTime());?
object.put("creator",?user.getCreator());?
object.put("menusId",?user.getMenusId());?
object.put("isValid",?(user.getValid().equals("1")?"有效":"無效"));?
array.add(object);?
}?
AjaxTool.returnAjaxResponse(response,?array.toJSONString());?
}?
//獲取總的記錄數(shù)和總頁(yè)數(shù)?
public?void?getPageCount(ActionMapping?mapping,?ActionForm?form,?
HttpServletRequest?request,?HttpServletResponse?response){?
RequestTool?tool?=?new?RequestTool(request);?
int?pageSize?=?tool.getIntParameter("pageSize");?
ListPOJO?pojos?=?serviceSmUserImpl.findAll();?
int?pageCount?=?pojos.size()%?pageSize??0???(pojos.size()/?pageSize+1):(pojos.size()/?pageSize);?
JSONArray?array?=?new?JSONArray();?
JSONObject?object?=?new?JSONObject();?
object.put("pageCount",?pageCount);?
object.put("totalCount",?pojos.size());?
array.add(object);?
AjaxTool.returnAjaxResponse(response,array.toJSONString());?
}
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 行數(shù),如:0-第一行 1-第二行 -2-倒數(shù)第二行 -1-最后一行
* trHtml 添加行的html代碼
*
*/
function addTr(tab, row, trHtml){
//獲取table最后一行 $("#tab tr:last")
//獲取table第一行 $("#tab tr").eq(0)
//獲取table倒數(shù)第二行 $("#tab tr").eq(-2)
var $tr=$("#"+tab+" tr").eq(row);
if($tr.size()==0){
alert("指定的table id或行數(shù)不存在!");
return;
}
$tr.after(trHtml);
}
3、然后在輸入下方的代碼:
function delTr(ckb){
//獲取選中的復(fù)選框,然后循環(huán)遍歷刪除
var ckbs=$("input[name="+ckb+"]:checked");
if(ckbs.size()==0){
alert("要?jiǎng)h除指定行,需選中要?jiǎng)h除的行!");
return;
}
ckbs.each(function(){
$(this).parent().parent().remove();
});
}
/**
* 全選
*
* allCkb 全選復(fù)選框的id
* items 復(fù)選框的name
*/
function allCheck(allCkb, items){
$("#"+allCkb).click(function(){
$('[name='+items+']:checkbox').attr("checked", this.checked );
});
}
////////添加一行、刪除一行測(cè)試方法///////
$(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"http://td
td width="30%"科目/td
td width="30%"成績(jī)/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、然后這樣就完成了。
一、數(shù)據(jù)準(zhǔn)備
二、操作
//1.鼠標(biāo)移動(dòng)行變色
$("#table1 tr").hover(function(){
$(this).children("td").addClass("hover")
},function(){
$(this).children("td").removeClass("hover")
})
$("#table2 tr:gt(0)").hover(function() {
$(this).children("td").addClass("hover");
}, function() {
$(this).children("td").removeClass("hover");
});
//2.奇偶行不同顏色
$("#table3 tbody tr:odd").css("background-color", "#bbf");
$("#table3 tbody tr:even").css("background-color","#ffc");
$("#table3 tbody tr:odd").addClass("odd")
$("#table3 tbody tr:even").addClass("even")
//3.隱藏一行
$("#table3 tbody tr:eq(3)").hide();
//4.隱藏一列
$("#table5 tr td::nth-child(3)").hide();
$("#table5 tr").each(function(){$("td:eq(3)",this).hide()});
//5.刪除一行
// 刪除除第一行外的所有行
$("#table6 tr:not(:first)").remove();
//6.刪除一列
// 刪除除第一列外的所有列
$("#table6 tr td:not(:nth-child(1))").remove();
//7.得到(設(shè)置)某個(gè)單元格的值
//設(shè)置table7,第2個(gè)tr的第一個(gè)td的值。
$("#table7 tr:eq(1) td:nth-child(1)").html("value");
//獲取table7,第2個(gè)tr的第一個(gè)td的值。
$("#table7 tr:eq(1) td:nth-child(1)").html();
//8.插入一行:
//在第二個(gè)tr后插入一行
$("插入3插入插入插入").insertAfter($("#table7 tr:eq(1)"));
//刪除指定行(第二行) $("#table3 tr:gt(0):eq(1)").remove();
(2)刪除列,比如刪除表格中的第二列:
//eq:獲取子元素索引從 0 開始,先刪除表頭$("#table3 tr th:eq(1)").remove();//nth-child:獲取子元素從 1 開始$("#table3 tr td:nth-child(2)").remove();
(3)刪除其它行,比如第二行之外的所有行:
$("#table3 tr:gt(0):not(:eq(1))").remove();
(4)刪除其它列,比如第二列之外的所有列:
//先刪除表頭$("#table3 tr th:not(:eq(1))").remove();$("#table3 tr td:not(:nth-child(2))").remove();
(5)隱藏行,比如隱藏第二行:
$("#table3 tr:gt(0):eq(1)").hide();//或者//$("#table3 tr:gt(0):eq(1)").css("display", "none")//顯示//$("#table3 tr:gt(0):eq(1)").css("display", "");
(6)隱藏列,比如隱藏第二列:
$("#table3 tr th:eq(1)").hide();
$("#table3 tr td:nth-child(2)").hide();
//或者
//$("#table3 tr th:eq(1)").css("display", "none");
//$("#table3 tr td:nth-child(2)").css("display", "none");
//顯示
//$("#table3 tr th:eq(1)").css("display", "");
//$("#table3 tr td:nth-child(2)").css("display", "");
jquery 獲取 table 總行數(shù):
$("table tr").size();
var hang = $("#g").find("tr").length;
jquery 獲取 table 總列數(shù):
$("table td").size();
var lie = $("#g").find("tr").find("td").length-1;