jQuery自动添加表单项的方法


Posted in Javascript onJuly 13, 2015

本文实例讲述了jQuery自动添加表单项的方法。分享给大家供大家参考。具体如下:

这里实现通过点击按钮动态添加一个表单输入项

<script type="text/javascript" charset="utf-8">
 $(function() {
 var fieldCount = 1;
 $("#addFieldButton").click(function() {
  fieldCount++;
  if(fieldCount <= 5)
  {
  var fieldID = "recipient_email_" + fieldCount;
  $("#additionalEmails").append("<label for='"+fieldID+"'>Recipient Email "+fieldCount+": </label>"+ 
      "<input type='text' name='"+fieldID+"' " +
      "id='"+fieldID+"' size='30'><br />" );
  }
  else
  {
  alert("Maximum email fields reached.");
  }
 });
 });
</script>

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

Javascript 相关文章推荐
用客户端js实现带省略号的分页
Apr 27 Javascript
解析JavaScript中点号“.”的多义性
Dec 02 Javascript
javascript实时显示北京时间的方法
Mar 12 Javascript
javascript使用shift+click实现选择和反选checkbox的方法
May 04 Javascript
Bootstrap创建可折叠的组件
Feb 23 Javascript
ArtEditor富文本编辑器增加表单提交功能
Apr 18 Javascript
Backbone中View之间传值的学习心得
Aug 09 Javascript
Vue2学习笔记之请求数据交互vue-resource
Feb 23 Javascript
原生js中ajax访问的实例详解
Sep 19 Javascript
微信小程序自定义可滑动顶部TabBar选项卡实现页面切换功能示例
May 14 Javascript
小程序实现上下移动切换位置
Sep 23 Javascript
JavaScript实现消消乐的源代码
Jan 12 Javascript
JavaScript去除数组里重复值的方法
Jul 13 #Javascript
javascript实现根据iphone屏幕方向调用不同样式表的方法
Jul 13 #Javascript
jQuery检测返回值的数据类型
Jul 13 #Javascript
jQuery常用且重要方法汇总
Jul 13 #Javascript
C#中使用迭代器处理等待任务
Jul 13 #Javascript
浅谈jquery.fn.extend与jquery.extend区别
Jul 13 #Javascript
jQuery中extend函数详解
Jul 13 #Javascript
You might like
PHP学习之整理字符串
2011/04/17 PHP
php调用C代码的实现方法
2014/03/11 PHP
windows7下安装php的imagick和imagemagick扩展教程
2014/07/04 PHP
PHP tp5中使用原生sql查询代码实例
2020/10/28 PHP
基于jQuery的前端数据通用验证库
2011/08/08 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
2011/09/29 Javascript
nodejs win7下安装方法
2012/05/24 NodeJs
jquery中change()用法实例分析
2015/02/06 Javascript
Javascript监视变量变化的方法
2015/06/09 Javascript
JavaScript采用递归算法计算阶乘实例
2015/08/04 Javascript
jquery动态导航插件dynamicNav用法实例分析
2015/09/06 Javascript
JavaScript使用DeviceOne开发实战(三)仿微信应用
2015/12/02 Javascript
去除字符串左右两边的空格(实现代码)
2016/05/12 Javascript
jQuery简单实现页面元素置顶时悬浮效果示例
2016/08/01 Javascript
js实现网页定位导航功能
2017/03/07 Javascript
JavaScript中的高级函数
2018/01/04 Javascript
在vue项目中,将juery设置为全局变量的方法
2018/09/25 Javascript
elementUI Tree 树形控件的官方使用文档
2019/04/25 Javascript
JavaScript中BOM对象原理与用法分析
2019/07/09 Javascript
浅析Vue 防抖与节流的使用
2019/11/14 Javascript
Vue的data、computed、watch源码浅谈
2020/04/04 Javascript
在Vue 中实现循环渲染多个相同echarts图表
2020/07/20 Javascript
原生JavaScript实现弹幕组件的示例代码
2020/10/12 Javascript
[00:37]DOTA2上海特级锦标赛 OG战队宣传片
2016/03/03 DOTA
[02:38]DOTA2亚洲邀请赛小组赛精彩集锦:Wings完美团击溃对手
2017/03/29 DOTA
Python编写屏幕截图程序方法
2015/02/18 Python
Python3 利用requests 库进行post携带账号密码请求数据的方法
2018/10/26 Python
python爬取内容存入Excel实例
2019/02/20 Python
Python字符串处理的8招秘籍(小结)
2019/08/13 Python
python网络爬虫 CrawlSpider使用详解
2019/09/27 Python
win10从零安装配置pytorch全过程图文详解
2020/05/08 Python
python基于socket模拟实现ssh远程执行命令
2020/12/05 Python
TensorFlow的环境配置与安装方法
2021/02/20 Python
好家长事迹材料
2014/01/23 职场文书
2015国庆节66周年标语
2015/07/30 职场文书
使用CSS自定义属性实现骨架屏效果
2022/06/21 HTML / CSS