jQuery动态添加及删除表单上传元素的方法(附demo源码下载)


Posted in Javascript onJanuary 15, 2016

本文实例讲述了jQuery动态添加及删除表单上传元素的方法。分享给大家供大家参考,具体如下:

运行效果截图如下:

jQuery动态添加及删除表单上传元素的方法(附demo源码下载)

点击此处查看在线演示效果。

具体代码如下:

<html>
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $(":input[type=button][value=more]").bind("click",function(){
 var $br = $("<br />");
 var $file = $("<input type='file' name='name1' />");
 var $button = $("<input type='button' value='delete'>");
 $(this).after($file).after($button).after($br);
 $button.bind("click",function(){
  $br.remove();
  $file.remove();
  $button.remove();
 })
 })
});
</script>
</head>
<body>
<input type="file" name="file1" /><input type="button" value="more" />
</body>
</html>

完整实例代码点击此处本站下载。

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

Javascript 相关文章推荐
基于jQuery的为attr添加id title等效果的实现代码
Apr 20 Javascript
js实现表格字段排序
Feb 19 Javascript
javascript随机显示背景图片的方法
Jun 18 Javascript
jQuery实现仿QQ头像闪烁效果的文字闪动提示代码
Nov 03 Javascript
JS实现的DIV块来回滚动效果示例
Feb 07 Javascript
vue-axios使用详解
May 10 Javascript
基于复选框demo(分享)
Sep 27 Javascript
JS中数据结构之栈
Jan 01 Javascript
JavaScript设计模型Iterator实例解析
Jan 22 Javascript
vue 实现超长文本截取,悬浮框提示
Jul 29 Javascript
Vue组件通信$attrs、$listeners实现原理解析
Sep 03 Javascript
一篇文章了解正则表达式的替换技巧
Feb 24 Javascript
JavaScript焦点事件、鼠标事件和滚轮事件使用详解
Jan 15 #Javascript
JavaScript提高性能知识点汇总
Jan 15 #Javascript
学习JavaScript设计模式之中介者模式
Jan 14 #Javascript
轻松实现jquery手风琴效果
Jan 14 #Javascript
jQuery取得iframe中元素的常用方法详解
Jan 14 #Javascript
js实现prototype扩展的方法(字符串,日期,数组扩展)
Jan 14 #Javascript
分享网页检测摇一摇实例代码
Jan 14 #Javascript
You might like
php 错误处理经验分享
2011/10/11 PHP
PHP中全面阻止SQL注入式攻击分析小结
2012/01/30 PHP
php获取textarea的值并处理回车换行的方法
2014/10/20 PHP
php利用cookie实现自动登录的方法
2014/12/10 PHP
PHP实现的方程求解示例分析
2016/11/11 PHP
PHP基于DOM创建xml文档的方法示例
2017/02/08 PHP
Yii2.0框架模型多表关联查询示例
2019/07/18 PHP
找到一点可怜的关于dojo资料,谢谢作者!
2006/12/06 Javascript
JavaScript在多浏览器下for循环的使用方法
2012/11/07 Javascript
JS中setTimeout()的用法详解
2013/04/14 Javascript
使用js 设置url参数
2013/07/08 Javascript
jquery 隐藏与显示tr标签示例代码
2014/06/06 Javascript
JavaScript使用yield模拟多线程的方法
2015/03/19 Javascript
Angular的MVC和作用域
2016/12/26 Javascript
jQuery插件FusionCharts绘制的3D环饼图效果示例【附demo源码】
2017/04/02 jQuery
详解Angular中的自定义服务Service、Provider以及Factory
2017/04/22 Javascript
AngularJS使用ocLazyLoad实现js延迟加载
2017/07/05 Javascript
vue数据控制视图源码解析
2018/03/28 Javascript
带你使用webpack快速构建web项目的方法
2020/11/12 Javascript
Python with用法实例
2015/04/14 Python
python使用matplotlib绘图时图例显示问题的解决
2017/04/27 Python
Linux CentOS7下安装python3 的方法
2018/01/21 Python
python如何读写csv数据
2018/03/21 Python
关于Python 的简单栅格图像边界提取方法
2019/07/05 Python
Python数据处理篇之Sympy系列(五)---解方程
2019/10/12 Python
Python爬虫实例——scrapy框架爬取拉勾网招聘信息
2020/07/14 Python
CSS3属性box-shadow使用详细教程
2012/01/21 HTML / CSS
使用HTML5进行SVG矢量图形绘制的入门教程
2016/02/19 HTML / CSS
简述进程的启动、终止的方式以及如何进行进程的查看
2014/02/20 面试题
政府绩效管理实施方案
2014/05/04 职场文书
抗洪救灾标语
2014/10/08 职场文书
2014年小学安全工作总结
2014/12/04 职场文书
化验员岗位职责
2015/02/14 职场文书
城南旧事读书笔记
2015/06/29 职场文书
校长新学期致辞
2015/07/30 职场文书
德劲DE1108畅想
2021/04/22 无线电