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实现运行代码需要刷新的解决方法
Aug 18 Javascript
AngularJS初始化过程分析(引导程序)
Dec 06 Javascript
JavaScript 学习笔记之语句
Jan 14 Javascript
浅谈Unicode与JavaScript的发展史
Jan 19 Javascript
浅谈js中的三种继承方式及其优缺点
Aug 10 Javascript
JS简单测试循环运行时间的方法
Sep 04 Javascript
JS判断指定dom元素是否在屏幕内的方法实例
Jan 23 Javascript
Javascript中 带名 匿名 箭头函数的重要区别(推荐)
Jan 29 Javascript
Easyui Datagrid自定义按钮列(最后面的操作列)
Jul 13 Javascript
基于AngularJs select绑定数字类型的问题
Oct 08 Javascript
JS+DIV实现拖动效果
Feb 11 Javascript
js重写alert事件(避免alert弹框标题出现网址)
Dec 04 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-Fcgi下PHP的执行时间设置方法
2013/08/02 PHP
thinkPHP中分页用法实例分析
2015/12/26 PHP
php 三大特点:封装,继承,多态
2017/02/19 PHP
Javascript 读书笔记索引贴
2010/01/11 Javascript
调试Node.JS的辅助工具(NodeWatcher)
2012/01/04 Javascript
javaScript(JS)替换节点实现思路介绍
2013/04/17 Javascript
10分钟学会写Jquery插件实例教程
2014/09/06 Javascript
JS去除iframe滚动条的方法
2015/04/01 Javascript
js实现文本框选中的方法
2015/05/26 Javascript
跟我学习javascript的定时器
2015/11/19 Javascript
JavaScript对象数组排序实例方法浅析
2016/06/15 Javascript
轻松学习Javascript闭包
2017/03/01 Javascript
使用Bootstrap打造特色进度条效果
2017/05/02 Javascript
深入理解node.js http模块
2018/01/24 Javascript
红黑树的插入详解及Javascript实现方法示例
2018/03/26 Javascript
angular6 利用 ngContentOutlet 实现组件位置交换(重排)
2018/11/02 Javascript
微信小程序之swiper滑动面板用法示例
2018/12/04 Javascript
小程序hover-class点击态效果实现
2019/02/26 Javascript
js 根据对象数组中的属性进行排序实现代码
2019/09/12 Javascript
Vue实现渲染数据后控制滚动条位置(推荐)
2019/12/09 Javascript
jquery实现的放大镜效果示例
2020/02/24 jQuery
JS+CSS实现炫酷光感效果
2020/09/05 Javascript
[47:02]2018DOTA2亚洲邀请赛3月29日 小组赛B组 VP VS paiN
2018/03/30 DOTA
PyCharm设置每行最大长度限制的方法
2019/01/16 Python
Python Opencv实现图像轮廓识别功能
2020/03/23 Python
django使用haystack调用Elasticsearch实现索引搜索
2019/07/24 Python
Python 获取指定文件夹下的目录和文件的实现
2019/08/30 Python
如何一键升级Python所有包
2020/11/05 Python
用python爬虫批量下载pdf的实现
2020/12/01 Python
Python 实现劳拉游戏的实例代码(四连环、重力四子棋)
2021/03/03 Python
连卡佛中国官网:Lane Crawford中文站
2018/01/27 全球购物
在线购买世界上最好的酒:BoozeBud
2018/06/07 全球购物
建筑安全生产目标责任书
2014/07/23 职场文书
2015年校医个人工作总结
2015/07/24 职场文书
python基础之匿名函数详解
2021/04/21 Python
Python中Selenium对Cookie的操作方法
2021/07/09 Python