生活随笔
收集整理的這篇文章主要介紹了
Js实现动态插入删除文本框
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
自己做了個Js插入文本框的例子，扔上別忘了。
<html><head><title>Untitled Document</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><script language="javascript">var qus = new Array();function Question() {this.qno = qus.length;this.ono = 0;this.create = function(table) {var qstr = "";qstr += "<hr id=\"qu" + this.qno + "div\"><div id=\"qu" + this.qno + "\"><h2>問題??" + (this.qno + 1) + "</h2>";qstr += "<input type=\"text\" name=\"questions[" + this.qno + "]\" value=\"questions[" + this.qno + "]\" />";qstr += "<div id=\"qu" + this.qno + "op\"><b>* 選項 *</b>";qstr += "<br /><input type=\"text\" value=\"qu" + this.qno + "op" + this.ono + "\" id=\"qu" + this.qno + "op" + this.ono + "\"/>";qstr += "</div>";qstr += "<input type=\"button\" value=\"增加選項\" οnclick=\"qus[" + this.qno + "].addOption()\"/>";qstr += "<input type=\"button\" value=\"刪除選項\" οnclick=\"qus[" + this.qno + "].delOption()\"/>";qstr += "</div>";table.innerHTML += qstr;//alert(qstr);}this.addOption = function() {this.ono++;var opar = document.getElementById("qu" + this.qno + "op");opar.innerHTML += "<br id=\"qu" + this.qno + "op" + this.ono + "div\"/><input type=\"text\" value=\"qu" + this.qno + "op" + this.ono + "\" id=\"qu" + this.qno + "op" + this.ono + "\"/>";//alert(opar.innerHTML);}this.delOption = function() {if (this.ono > 0) {var quop = "qu" + this.qno + "op";var opx = "qu" + this.qno + "op" + this.ono;document.getElementById(quop).removeChild(document.getElementById(opx));document.getElementById(quop).removeChild(document.getElementById(opx + "div"));this.ono--;}}}function createQuestion() {var qu = new Question();qus.push(qu);qu.create(document.getElementById('table'));}function delQuestion() {if (qus.length > 0) {var qupr = "table";var qux = "qu" + (qus.length - 1);document.getElementById(qupr).removeChild(document.getElementById(qux));document.getElementById(qupr).removeChild(document.getElementById(qux + "div"));qus.pop();}}</script></head><body><div id="table"></div><br /><hr /><br /><input type="button" οnclick="createQuestion();" value="新建問題" /><input type="button" οnclick="delQuestion();" value="刪除問題" /><input type="submit" value="保存問卷" /></body></html>
總結
以上是生活随笔為你收集整理的Js实现动态插入删除文本框的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
