jquery 追加tr和删除tr示例代码


Posted in Javascript onSeptember 12, 2013
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> 
<script> 
$(function(){ 
$("#getAtr").click(function(){ 
$str=''; 
$str+="<tr align='center'>"; 
$str+="<td><input type='text' name='advTitle[]'/></td>"; 
$str+="<td><input type='file' name='img[]' /></td>"; 
$str+="<td><input type='text' name='advContent[]' /></td>"; 
$str+="<td><input type='text' name='advSource[]' /></td>"; 
$str+="<td><input type='text' name='advAuthor[]' /></td>"; 
$str+="<td><input type='text' name='advPosition[]' /></td>"; 
$str+="<td onClick='getDel(this)'><a href='#'>删除追加</a></td>"; 
$str+="</tr>"; 
$("#addTr").append($str); 
}); 
}); function getDel(k){ 
$(k).parent().remove(); 
} 
</script> 
-------------------------------------------------------------------------------- 
html部分 
<table align="center" border="1" cellpadding="0" cellspacing="0" width="100%"> 
<tr align="center"> 
<td>广告名称</td> 
<td>广告图片</td> 
<td>广告内容</td> 
<td>广告来源</td> 
<td>广告作者</td> 
<td>广告描述</td> 
<td align="center"><a href="#" id="getAtr">追加内容</a></td> 
</tr> 
<tbody id="addTr"> 
<tr align="center"> 
<td><input type="text" name="advTitle[]"/></td> 
<td><input type="file" name="img[]" /></td> 
<td><input type="text" name="advContent[]" /></td> 
<td><input type="text" name="advSource[]" /></td> 
<td><input type="text" name="advAuthor[]" /></td> 
<td><input type="text" name="advPosition[]" /></td> 
<td></td> 
</tr> 
</tbody> 
<tr align="center"> 
<td colspan="5"><input type="submit" value="全部添加" /></td> 
</tr> 
</table>
Javascript 相关文章推荐
JavaScript限定复选框的选择个数示例代码
Aug 25 Javascript
jQuery之Deferred对象详解
Sep 04 Javascript
AngularJS入门教程之Cookies读写操作示例
Nov 02 Javascript
canvas实现爱心和彩虹雨效果
Mar 09 Javascript
浅谈js使用in和hasOwnProperty获取对象属性的区别
Apr 27 Javascript
微信小程序 选项卡的简单实例
May 24 Javascript
JavaScript订单操作小程序完整版
Jun 23 Javascript
解决AjaxFileupload 上传时会出现连接重置的问题
Jul 07 Javascript
基于AngularJS实现表单验证功能
Jul 28 Javascript
vue interceptor 使用教程实例详解
Sep 13 Javascript
Vue项目报错:Uncaught SyntaxError: Unexpected token
Nov 10 Javascript
IDEA安装vue插件图文详解
Sep 26 Javascript
实现只能输入数字的input不用replace方法
Sep 12 #Javascript
jQuery 三击事件实现代码
Sep 11 #Javascript
导航跟随滚动条置顶移动示例代码
Sep 11 #Javascript
查找iframe里元素的方法可传参
Sep 11 #Javascript
Jquery 的outerHeight方法使用介绍
Sep 11 #Javascript
$.get获取一个文件的内容示例代码
Sep 11 #Javascript
JQuery触发事件例如click
Sep 11 #Javascript
You might like
实现树状结构的两种方法
2006/10/09 PHP
ThinkPHP采用模块和操作分析
2011/04/18 PHP
奇怪的PHP引用效率问题分析
2012/03/23 PHP
PHPEXCEL 使用小记
2013/01/06 PHP
ECMall支持SSL连接邮件服务器的配置方法详解
2014/05/19 PHP
支持生僻字且自动识别utf-8编码的php汉字转拼音类
2014/06/27 PHP
浅谈php正则表达式中的非贪婪模式匹配的使用
2014/11/25 PHP
PHP实现的简单日历类
2014/11/29 PHP
制作个性化的WordPress登陆界面的实例教程
2016/05/21 PHP
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
2008/12/25 Javascript
javascript Event对象详解及使用示例
2013/11/22 Javascript
QQ空间顶部折页撕开效果示例代码
2014/06/15 Javascript
JavaScript window.location对象
2014/11/14 Javascript
js常用DOM方法详解
2017/02/04 Javascript
Jquery-data的三种用法
2017/04/18 jQuery
js实现图片粘贴上传到服务器并展示的实例
2017/11/08 Javascript
javascript标准库(js的标准内置对象)总结
2018/05/26 Javascript
vue+axios+promise实际开发用法详解
2018/10/15 Javascript
vue-cli3环境变量与分环境打包的方法示例
2019/02/18 Javascript
产制造追溯系统之通过微信小程序实现移动端报表平台
2019/06/03 Javascript
[41:05]Serenity vs Pain 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
python中黄金分割法实现方法
2015/05/06 Python
Python实现配置文件备份的方法
2015/07/30 Python
Python通过命令开启http.server服务器的方法
2017/11/04 Python
对python3中pathlib库的Path类的使用详解
2018/10/14 Python
对python中xlsx,csv以及json文件的相互转化方法详解
2018/12/25 Python
python使用matplotlib画柱状图、散点图
2019/03/18 Python
python调用自定义函数的实例操作
2019/06/26 Python
Python爬虫实现的根据分类爬取豆瓣电影信息功能示例
2019/09/15 Python
Python Tensor FLow简单使用方法实例详解
2020/01/14 Python
美国女士泳装店:Swimsuits For All
2017/03/02 全球购物
普通大学毕业生自荐信
2013/11/04 职场文书
关爱女孩行动实施方案
2014/03/13 职场文书
《金色的脚印》教后反思
2014/04/23 职场文书
工作后的感想
2015/08/07 职场文书
Django一小时写出账号密码管理系统
2021/04/29 Python