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 相关文章推荐
JS操作Cookie写入和读取实例代码
Oct 20 Javascript
Js nodeType 属性全面解析
Nov 14 Javascript
使用VS开发 Node.js指南
Jan 06 Javascript
JS简单设置下拉选择框默认值的方法
Aug 20 Javascript
想学习javascript JS和jQuery哪个重要 先学哪个
Dec 11 Javascript
JavaScript简单计算人的年龄示例
Apr 15 Javascript
jQuery Validate格式验证功能实例代码(包括重名验证)
Jul 18 jQuery
JavaScript-定时器0~9抽奖系统详解(代码)
Aug 16 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
Aug 30 Javascript
浅谈在fetch方法中添加header后遇到的预检请求问题
Aug 31 Javascript
推荐一个基于Node.js的表单验证库
Feb 15 Javascript
webgl实现物体描边效果的方法介绍
Nov 27 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
php for 循环语句使用方法详细说明
2010/05/09 PHP
PHP禁止页面缓存的代码
2011/10/23 PHP
解析PHP中$_FILES的使用以及注意事项
2013/07/05 PHP
windows服务器中检测PHP SSL是否开启以及开启SSL的方法
2014/04/25 PHP
使用php语句将数据库*.sql文件导入数据库
2014/05/05 PHP
Mootools 1.2教程(2) DOM选择器
2009/09/14 Javascript
js判断屏幕分辨率的代码
2013/07/16 Javascript
JS简单的图片放大缩小的两种方法
2013/11/11 Javascript
jquery 页眉单行信息滚动显示实现思路及代码
2014/06/26 Javascript
使用Node.js实现HTTP 206内容分片的教程
2015/06/23 Javascript
JavaScript中实现键值对应的字典与哈希表结构的示例
2016/06/12 Javascript
轮播的简单实现方法
2016/07/28 Javascript
Bootstrap表单控件使用方法详解
2017/01/11 Javascript
如何开发出更好的JavaScript模块
2017/12/22 Javascript
JavaScript实现美化滑块效果
2019/05/17 Javascript
仅利用30行Python代码来展示X算法
2015/04/01 Python
Python import用法以及与from...import的区别
2015/05/28 Python
python网络编程调用recv函数完整接收数据的三种方法
2017/03/31 Python
django启动uwsgi报错的解决方法
2018/04/08 Python
用TensorFlow实现lasso回归和岭回归算法的示例
2018/05/02 Python
Python 创建空的list,以及append用法讲解
2018/05/04 Python
python3实现点餐系统
2019/01/24 Python
Python3.5 Pandas模块之Series用法实例分析
2019/04/23 Python
Python 3.8 新功能全解
2019/07/25 Python
python 实现Requests发送带cookies的请求
2021/02/08 Python
html5 css3 动态气泡按钮实例演示
2012/12/02 HTML / CSS
总结30个CSS3选择器
2017/04/13 HTML / CSS
HTML中fieldset标签概述及使用方法
2013/02/01 HTML / CSS
Ryderwear美国官网:澳大利亚高端健身训练装备品牌
2018/04/24 全球购物
Champs Sports加拿大:北美最大的以商场为基础的专业运动鞋和服装零售商之一
2018/05/01 全球购物
师范生自我鉴定
2014/03/20 职场文书
奶茶店创业计划书
2014/08/14 职场文书
观看《杨善洲》宣传教育片心得体会
2016/01/23 职场文书
Java org.w3c.dom.Document 类方法引用报错
2021/08/07 Java/Android
SpringBoot2零基础到精通之数据库专项精讲
2022/03/22 Java/Android
Redis基本数据类型Set常用操作命令
2022/06/01 Redis