JSP中使用JavaScript動(dòng)態(tài)插入刪除輸入框?qū)崿F(xiàn)代碼
更新時(shí)間：2014年06月13日 09:00:01 投稿：whsnow
這篇文章主要介紹了JSP中如何使用JavaScript動(dòng)態(tài)插入刪除輸入框,需要的朋友可以參考下
JavaScript代碼：
<script language="javascript">
function addrows(){
var len = optionlist.rows.length; //得到table的行數(shù)
var obj = optionlist.insertRow(len);//在最后一行插入
/**插入第一列**/
obj.insertCell(0);
obj.cells(0).innerHTML="選項(xiàng)" + (len+1) + "：<input type=text name=option size=28>";
}
function deleterow(){
var len = optionlist.rows.length;
if(len <= 1) {
alert("至少要有一個(gè)選項(xiàng)");
}
else {
optionlist.deleteRow(len-1);//刪除最后一項(xiàng)
}
}
function getOptionCount(){
return optionlist.rows.length;
}
</script>
Jsp頁(yè)面中的關(guān)鍵代碼
<input type="button" id="bt1" value="添加選項(xiàng)" onClick="addrows();">
<input type="button" id="bt2" value="刪除選項(xiàng)" onClick="deleterow();">
設(shè)置table的id以便JavaScript中能識(shí)別該table
<table id="optionlist">
</table>
復(fù)制代碼 代碼如下:
<script language="javascript">
function addrows(){
var len = optionlist.rows.length; //得到table的行數(shù)
var obj = optionlist.insertRow(len);//在最后一行插入
/**插入第一列**/
obj.insertCell(0);
obj.cells(0).innerHTML="選項(xiàng)" + (len+1) + "：<input type=text name=option size=28>";
}
function deleterow(){
var len = optionlist.rows.length;
if(len <= 1) {
alert("至少要有一個(gè)選項(xiàng)");
}
else {
optionlist.deleteRow(len-1);//刪除最后一項(xiàng)
}
}
function getOptionCount(){
return optionlist.rows.length;
}
</script>
Jsp頁(yè)面中的關(guān)鍵代碼
復(fù)制代碼 代碼如下:
<input type="button" id="bt1" value="添加選項(xiàng)" onClick="addrows();">
<input type="button" id="bt2" value="刪除選項(xiàng)" onClick="deleterow();">
設(shè)置table的id以便JavaScript中能識(shí)別該table
復(fù)制代碼 代碼如下:
<table id="optionlist">
</table>
相關(guān)文章
微信小程序?qū)崿F(xiàn)人臉識(shí)別登陸的示例代碼
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)人臉識(shí)別登陸的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
這篇文章主要為大家整理了18個(gè)JavaScript優(yōu)化冗余代碼的技巧，文中的示例代碼簡(jiǎn)潔易懂，具有一定的借鑒價(jià)值，感興趣的小伙伴可以了解一下2023-08-08
Bootstrap選項(xiàng)卡學(xué)習(xí)筆記分享
這篇文章主要為大家詳細(xì)介紹了Bootstrap選項(xiàng)卡學(xué)習(xí)筆記，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-02-02
這篇文章主要給大家介紹了關(guān)于uniapp表單校驗(yàn)的相關(guān)資料,Uni-app內(nèi)置了一些表單驗(yàn)證方法,可以幫助我們對(duì)表單進(jìn)行有效的驗(yàn)證,需要的朋友可以參考下2023-10-10
使用百度地圖api實(shí)現(xiàn)根據(jù)地址查詢經(jīng)緯度
這篇文章主要介紹了使用百度地圖api實(shí)現(xiàn)根據(jù)地址查詢經(jīng)緯度的方法，附上實(shí)例，推薦給有需要的小伙伴們。2014-12-12
JavaScript判斷數(shù)組重復(fù)內(nèi)容的兩種方法(推薦)
本文給大家介紹兩種JavaScript判斷數(shù)組重復(fù)內(nèi)容的方法(推薦)非常不錯(cuò)具有參考借鑒價(jià)值，感興趣的朋友一起看看吧2016-06-06
這篇文章主要介紹了js圖片輪播效果實(shí)現(xiàn)代碼，文章對(duì)每一步進(jìn)行了詳細(xì)闡述，標(biāo)注注意事項(xiàng)，為順利實(shí)現(xiàn)js圖片輪播效果做好鋪墊，對(duì)輪播效果感興趣的朋友可以參考一下2015-11-11
JS選項(xiàng)卡動(dòng)態(tài)替換banner圖片路徑的方法
這篇文章主要介紹了JS選項(xiàng)卡動(dòng)態(tài)替換banner圖片路徑的方法,涉及javascript操作文件css樣式的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-05-05
javascript數(shù)組的定義及操作實(shí)例
在文章里小編給大家整理的是關(guān)于javascript數(shù)組的定義及操作的相關(guān)知識(shí)點(diǎn)，需要的朋友們學(xué)習(xí)下。2019-11-11
JavaScript 中Date對(duì)象的格式化代碼方法匯總
JavaScript默認(rèn)的時(shí)間格式我們一般情況下不會(huì)用，所以需要進(jìn)行格式化，下面小編給大家?guī)?lái)了三種js date對(duì)象格式化實(shí)例代碼，需要的朋友參考下吧2017-09-09