//記錄添加行數(shù)

var areaCount=1;

//記錄實(shí)際表格行數(shù)

var rowCount=1;

//刪除模板html

var delRowTemplete = "<td><a href='javascript:void(0);' class='content_del' onclick='deleteBatchRow(this)'>刪除</a></td>";

//表格行模板

var addRowTemplete= "";

$(function(){

//首先取出需要克隆的模板，模板行<tr>id為rowTemplete_0

addRowTemplete=  $("#rowTemplete_0").html();

});

//增加行

function addBatchRow(type){

var templete = $("<tr id='rowTemplete_"+areaCount+"'></tr>");

//遞增序號(hào)，替換掉tr或者td中存在[0]、_0或者(0)防止id相同,這么設(shè)計(jì)主要是為了后臺(tái)取值時(shí)方便

templete = templete.append(addRowTemplete.replace(/\[0\]/g,"["+areaCount+"]").replace(/_0/g,"_"+areaCount).

replace("processStat(\"0\")","processStat("+areaCount+")"));

//找到最后一條存在的行,在其后拼接一行

var flag = false;

for(var i=areaCount-1;i>=0;i--){

if($("#rowTemplete_"+i).length>0){ $("#rowTemplete_"+i).after(templete.append(delRowTemplete));

break;}

}

//計(jì)數(shù)加一

areaCount++; rowCount++;

}

//刪除行

function deleteBatchRow(obj){

if(rowCount>1) {

$(obj).parents("tr").remove(); 

rowCount--;

} else alert("至少保留一行");//如果全部刪除了，那么也就沒(méi)有辦法再添加行了，模板行也被刪了呀

}

//取得條數(shù)

function getAreaCount(){

return rowCount;

}

后臺(tái)使用的也是比較容易的，在FormBean里面定義數(shù)組變量來(lái)get和set，很方便的。

希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

基于jQuery實(shí)現(xiàn)彈幕APP
這篇文章主要為大家詳細(xì)介紹了基于jQuery實(shí)現(xiàn)彈幕APP的相關(guān)資料，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-02-02
jQuery插件cxSelect多級(jí)聯(lián)動(dòng)下拉菜單實(shí)例解析
這篇文章主要為大家詳細(xì)解析了jQuery插件cxSelect多級(jí)聯(lián)動(dòng)下拉菜單實(shí)例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-06-06
如何使用CSS3和JQuery easing 插件制作絢麗菜單
這篇文章主要介紹了如何使用CSS3和JQuery easing 插件制作絢麗菜單，這樣做可以讓有菜單的盒子滑出，并且彈出縮略圖。在某些菜單項(xiàng)中我們還包含著有進(jìn)一步鏈接的子菜單。取決于我們鼠標(biāo)在菜單項(xiàng)上的停懸，子菜單將向左或向右滑動(dòng)。,需要的朋友可以參考下
2019-06-06
jQuery選擇器之屬性篩選選擇器用法詳解
下面小編就為大家?guī)?lái)一篇jQuery選擇器之屬性篩選選擇器用法詳解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
jQuery使用ajax傳遞json對(duì)象到服務(wù)端及contentType的用法示例
這篇文章主要介紹了jQuery使用ajax傳遞json對(duì)象到服務(wù)端及contentType的用法,結(jié)合實(shí)例形式分析了jQuery使用ajax傳遞json對(duì)象數(shù)據(jù)及服務(wù)器響應(yīng)相關(guān)操作技巧,需要的朋友可以參考下
2020-03-03
jQuery中用on綁定事件時(shí)需注意的事項(xiàng)
本篇文章主要介紹了jQuery中用on綁定事件時(shí)需注意的事項(xiàng)，具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
2017-03-03
基于jQuery的遍歷同id元素并響應(yīng)事件的代碼
寫(xiě)網(wǎng)頁(yè)的時(shí)候，腳本循環(huán)的時(shí)候有很多時(shí)候都會(huì)循環(huán)出來(lái)同id的網(wǎng)頁(yè)元素，下面貼出來(lái)代碼，如何利用jQuery對(duì)這些元素進(jìn)行逐一遍歷并可響應(yīng)消息
2012-06-06
淺談jquery中使用canvas的問(wèn)題
下面小編就為大家?guī)?lái)一篇淺談jquery中使用canvas的問(wèn)題。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-10-10
引用jquery框架后出錯(cuò)的解決方法
下面小編就為大家?guī)?lái)一篇引用jquery框架后出錯(cuò)的解決方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-08-08
jQuery ajax serialize()方法的使用以及常見(jiàn)問(wèn)題解決
使用ajax時(shí)，常常需要拼裝input數(shù)據(jù)為'name=abc&sex=1'這種形式，用JQuery的serialize方法可以輕松的完成這個(gè)工作接下來(lái)介紹jQuery ajax - serialize() 方法定義和用法，感興趣的朋友可以了解下啊，希望本文對(duì)你有所幫助
2013-01-01