基于Jquery的动态添加控件并取值的实现代码


Posted in Javascript onSeptember 24, 2010
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>Jquery动态控件</title> 
<script src="jquery-1.4.2.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function() { 
var i = 2; 
$('#addText').click(function() { 
if (i < 9) { 
$('#main').append('<div><input type="text" name="text" + i + ""/> 











<a href="#" class="del-text">del</a></div>'); 
i++; 
} else { 
alert("最多只能添加8个"); 
} 
}); 
$('.del-text').live('click',function(){ 
$(this).parent().remove(); 
i--; 
}); 
}); 
</script> 
</head> 
<body> 
<div id="main"> 
<div> 
<input type="text" name="text1" /> 
</div> 
</div> 
<a id="addText" href="#">添加文本框</a> 
</body> 
</html>

先把前台的整理出来,项目临时有需求,先去忙了,稍后发后台取值的方法...
Javascript 相关文章推荐
非阻塞动态加载javascript广告实现代码
Nov 17 Javascript
Knockout visible绑定使用方法
Nov 15 Javascript
详谈jQuery中的this和$(this)
Nov 13 Javascript
微信小程序 使用腾讯地图SDK详解及实现步骤
Feb 28 Javascript
vue v-model表单控件绑定详解
May 17 Javascript
详解vue项目优化之按需加载组件-使用webpack require.ensure
Jun 13 Javascript
iview table render集成switch开关的实例
Mar 14 Javascript
Vue项目使用CDN优化首屏加载问题
Apr 01 Javascript
vue iview实现动态路由和权限验证功能
Apr 17 Javascript
React 使用recharts实现散点地图的示例代码
Dec 07 Javascript
CKeditor4 字体颜色功能配置方法教程
Jun 26 Javascript
vue+ts下对axios的封装实现
Feb 18 Javascript
封装的原生javascript弹出层代码
Sep 24 #Javascript
js最简单的拖拽效果实现代码
Sep 24 #Javascript
JavaScript 设计模式 安全沙箱模式
Sep 24 #Javascript
IE无法设置短域名下Cookie
Sep 23 #Javascript
Javascript中获取出错代码所在文件及行数的代码
Sep 23 #Javascript
基于JQuery的一个简单的鼠标跟随提示效果
Sep 23 #Javascript
用js模拟JQuery的show与hide动画函数代码
Sep 20 #Javascript
You might like
PHP5/ZendEngine2的改进
2006/10/09 PHP
php入门之连接mysql数据库的一个类
2012/04/21 PHP
php去掉URL网址中带有PHPSESSID的配置方法
2014/07/08 PHP
PHP创建单例后台进程的方法示例
2017/05/23 PHP
php中输出json对象的值(实现方法)
2018/03/07 PHP
PHP实现可精确验证身份证号码的工具类示例
2018/05/31 PHP
详解将数据从Laravel传送到vue的四种方式
2019/10/16 PHP
线路分流自动跳转代码;希望对大家有用!
2006/12/02 Javascript
用js实现预览待上传的本地图片
2007/03/15 Javascript
jQuery的实现原理的模拟代码 -3 事件处理
2010/08/03 Javascript
eval与window.eval的差别分析
2011/03/17 Javascript
js原型继承的两种方法对比介绍
2014/03/30 Javascript
Javascript Memoizer浅析
2014/10/16 Javascript
PHPMyAdmin导入时提示文件大小超出PHP限制的解决方法
2015/03/30 Javascript
JS实现的最简Table选项卡效果
2015/10/14 Javascript
浅谈jQuery绑定事件会叠加的解决方法和心得总结
2016/10/26 Javascript
Javascript 高性能之递归,迭代,查表法详解及实例
2017/01/08 Javascript
d3.js中冷门却实用的内置函数总结
2017/02/04 Javascript
前端axios下载excel文件(二进制)的处理方法
2018/07/31 Javascript
node.js使用mongoose操作数据库实现购物车的增、删、改、查功能示例
2019/12/23 Javascript
jQuery实现王者荣耀手风琴效果
2020/01/17 jQuery
原生js+canvas实现下雪效果
2020/08/02 Javascript
windows下ipython的安装与使用详解
2016/10/20 Python
python切片(获取一个子列表(数组))详解
2019/08/09 Python
简单了解django文件下载方式
2020/02/10 Python
基于python实现操作git过程代码解析
2020/07/27 Python
80年代复古T恤:TruffleShuffle
2018/07/02 全球购物
美国孩之宝玩具官网:Hasbro Pulse
2019/06/24 全球购物
士力架广告词
2014/03/20 职场文书
学生会部长竞聘书
2014/03/31 职场文书
药剂专业自荐书
2014/06/20 职场文书
群众路线自我剖析及整改措施
2014/11/04 职场文书
清明节寄语2015
2015/03/23 职场文书
《思路决定出路》读后感3篇
2019/12/11 职场文书
python图片灰度化处理的几种方法
2021/06/23 Python
Go语言实现一个简单的并发聊天室的项目实战
2022/03/18 Golang