js简单实现表单中点击按钮动态增加输入框数量的方法


Posted in Javascript onAugust 18, 2015

本文实例讲述了js简单实现表单中点击按钮动态增加输入框数量的方法。分享给大家供大家参考。具体如下:

这里演示表单中点击按钮动态增加输入框数量的方法,默认是没有输入框,点击按钮之后,输入框会不断的增加,每点击一次,增加一个,觉得挺不错吧,希望对你有所帮助。

运行效果如下图所示:

js简单实现表单中点击按钮动态增加输入框数量的方法

在线演示地址如下:

具体代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>点击按钮动态增加输入框数量</title>
</head>
<body>
<script>var i=1</script>
<input type=button onclick="document.body.insertAdjacentHTML('beforeEnd','<input type=text name='+i+' value='+i+++'> ')" value=添加>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript 模拟点击广告
Jan 02 Javascript
js加载读取内容及显示与隐藏div示例
Feb 13 Javascript
JavaScript控制各种浏览器全屏模式的方法、属性和事件介绍
Apr 03 Javascript
js实现文字在按钮上滚动的方法
Aug 20 Javascript
JQuery控制图片由中心点逐渐放大效果
Jun 26 Javascript
vue 实现的树形菜的实例代码
Mar 19 Javascript
Angular5集成eventbus的示例代码
Jul 19 Javascript
js实现导航跟随效果
Nov 17 Javascript
如何能分清npm cnpm npx nvm
Jan 17 Javascript
JavaScript实现拖拽盒子效果
Feb 06 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 Javascript
vue-admin-template配置快捷导航的代码(标签导航栏)
Sep 04 Javascript
js实现的简单radio背景颜色选择器代码
Aug 18 #Javascript
jquery SweetAlert插件实现响应式提示框
Aug 18 #Javascript
js+css实现上下翻页相册代码分享
Aug 18 #Javascript
javascript实现图片上传前台页面
Aug 18 #Javascript
jquery使用ul模拟select实现表单美化的方法
Aug 18 #Javascript
jQuery实现的漂亮表单效果代码
Aug 18 #Javascript
jquery实现select下拉框美化特效代码分享
Aug 18 #Javascript
You might like
ThinkPHP控制器间实现相互调用的方法
2014/10/31 PHP
使用PHPExcel操作Excel用法实例分析
2015/03/26 PHP
JavaScript中this关键字使用方法详解
2007/03/08 Javascript
动态样式类封装JS代码
2009/09/02 Javascript
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
用Jquery重写windows.alert方法实现思路
2013/04/03 Javascript
可自己添加html的伪弹出框实现代码
2013/09/08 Javascript
jquery删除指定的html标签并保留标签内文本内容的方法
2014/04/02 Javascript
javascript中函数作为参数调用的方法
2015/02/09 Javascript
动态的9*9乘法表效果的实现代码
2016/05/16 Javascript
Javascript中document.referrer隐藏来源的方法
2017/01/16 Javascript
详解AngularJS 路由 resolve用法
2017/04/24 Javascript
vue.js移动端tab组件的封装实践实例
2017/06/30 Javascript
使用Vue自定义数字键盘组件(体验度极好)
2017/12/19 Javascript
nodejs log4js 使用详解
2019/05/31 NodeJs
Vue前端判断数据对象是否为空的实例
2020/09/02 Javascript
Openlayers实现地图的基本操作
2020/09/28 Javascript
Python自定义函数的创建、调用和函数的参数详解
2014/03/11 Python
python简单判断序列是否为空的方法
2015/06/30 Python
Python使用lxml模块和Requests模块抓取HTML页面的教程
2016/05/16 Python
python好玩的项目—色情图片识别代码分享
2017/11/07 Python
对python借助百度云API对评论进行观点抽取的方法详解
2019/02/21 Python
Django实现简单网页弹出警告代码
2019/11/15 Python
pycharm部署、配置anaconda环境的教程
2020/03/24 Python
Tensorflow之MNIST CNN实现并保存、加载模型
2020/06/17 Python
python多线程和多进程关系详解
2020/12/14 Python
韩国11街:11STREET
2018/03/27 全球购物
成人高等教育毕业生自我鉴定
2013/10/22 职场文书
大专生的学习自我评价
2013/12/04 职场文书
饮料业务员岗位职责
2013/12/15 职场文书
实用求职信范文分享
2013/12/25 职场文书
领导干部群众路线个人对照检查材料思想汇报
2014/09/30 职场文书
党员教师四风问题整改措施思想汇报
2014/10/08 职场文书
加入学生会自荐书
2015/03/05 职场文书
小学大队长竞选稿
2015/11/20 职场文书
Go语言基础map用法及示例详解
2021/11/17 Golang