js动态的在页面上增加或删除一个文本框
2015-08-31 20:35
721 查看
转自http://www.5xsj.net/program/8/22/297.html
<html> <head> <title>js动态的在页面上增加或删除一个文本框</title> <script type="text/javascript"> <!-- var textNumber = 1; function addTextBox(form, afterElement) { // Increment the textbox number textNumber++; // Create the label var label = document.createElement("label"); // Create the textbox var textField = document.createElement("input"); textField.setAttribute("type","text"); textField.setAttribute("name","txt"+textNumber); textField.setAttribute("id","txt"+textNumber); // Add the label's text label.appendChild(document.createTextNode("Text Box #"+textNumber+": ")); // Put the textbox inside label.appendChild(textField); // Add it all to the form form.insertBefore(label,afterElement); return false; } function removeTextBox(form) { if (textNumber > 1) { // If there's more than one text box // Remove the last one added form.removeChild(document.getElementById("txt"+textNumber).parentNode); textNumber--; } } //--> </script> <style type="text/css"> <!-- label {display:block;} --> </style> </head> <body> <form id="myForm" method="get" action="./" /> <label>Text Box #1: <input type="text" name="txt1" id="txt1" /></label> <p> <input type="button" value="Add Textbox" onClick="addTextBox(this.form,this.parentNode)" /> <input type="button" value="Remove Textbox" onClick="removeTextBox(this.form)" /> </p> <p><input type="Submit" value="Submit" /></p> </form> </body> </html>
相关文章推荐
- 什么是JS跨域请求?有几种方式可以实现?请简述其中某一种的实现原理?
- Jsp 重定向、请求转发
- javascript面试题 之 js中this关键字的用法
- JSP userBean------从指定范围查找id内容,查不到就创建一个放到scope指定的范围里面
- JavaScript可否多线程?
- JS+Html控制控件的显示与隐藏
- Ajax总结
- js获取当前系统日期
- JS-基础
- seajs 使用文档
- JSON特殊字符处理
- three.js、webGL、canvas区别于关联
- js编码后台解码
- JSTL标签学习
- ExtJS 3 不能在IE9下正常运行的简单解决办法
- js 文本框禁止粘贴复制功能
- js延迟加载的几种方法
- JSON简单用法
- JSON数据解析——jsoncpp源码编辑
- Goods:动态加载所有的分类项到left.jsp