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 相关文章推荐
jQuery EasyUI API 中文文档 - DataGrid数据表格
Nov 17 Javascript
node.js中的fs.rename方法使用说明
Dec 16 Javascript
jQuery中wrapInner()方法用法实例
Jan 16 Javascript
javascript拖拽应用实例
Mar 25 Javascript
深入理解jQuery之防止冒泡事件
May 24 Javascript
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
Jun 01 Javascript
ES6学习教程之Map的常用方法总结
Aug 03 Javascript
jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法
Dec 05 jQuery
手把手教你用Node.js爬虫爬取网站数据的方法
Jul 05 Javascript
Vue中多个元素、组件的过渡及列表过渡的方法示例
Feb 13 Javascript
JavaScript实现简单的计算器
Jan 16 Javascript
vue中父子组件的参数传递和应用示例
Jan 04 Vue.js
实现只能输入数字的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
MySQL GBK→UTF-8编码转换
2007/05/24 PHP
php操作JSON格式数据的实现代码
2011/12/24 PHP
Apache服务器无法使用的解决方法
2013/05/08 PHP
深入浅析php中sprintf与printf函数的用法及区别
2016/01/08 PHP
php微信公众平台交互与接口详解
2016/11/28 PHP
php实现微信扫码支付
2017/03/26 PHP
phpcms实现验证码替换及phpcms实现全站搜索功能教程详解
2017/12/13 PHP
浅析Node在构建超媒体API中的作用
2014/07/30 Javascript
IE中document.createElement的iframe无法设置属性name的解决方法
2015/09/14 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
正则表达式替换html元素属性的方法
2016/11/26 Javascript
jQuery实现百度登录框的动态切换效果
2017/04/21 jQuery
Koa项目搭建过程详细记录
2018/04/12 Javascript
微信小程序实现蒙版弹窗效果
2018/11/01 Javascript
vue中input的v-model清空操作
2019/09/06 Javascript
微信小程序使用echarts获取数据并生成折线图
2019/10/16 Javascript
JS判断数组四种实现方法详解
2020/06/29 Javascript
Node.js 深度调试方法解析
2020/07/28 Javascript
vue项目开启Gzip压缩和性能优化操作
2020/10/26 Javascript
Python写的英文字符大小写转换代码示例
2015/03/06 Python
Python实现栈的方法
2015/05/26 Python
python实现的用于搜索文件并进行内容替换的类实例
2015/06/28 Python
pyenv命令管理多个Python版本
2017/03/26 Python
Flask实现跨域请求的处理方法
2018/09/27 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
python文件选择对话框的操作方法
2019/06/27 Python
python超时重新请求解决方案
2019/10/21 Python
Python代码块及缓存机制原理详解
2019/12/13 Python
瑞贝卡·泰勒官方网站:Rebecca Taylor
2016/09/24 全球购物
天猫超市:阿里巴巴打造的网上超市
2016/11/02 全球购物
大学老师推荐信
2014/02/25 职场文书
党员检讨书
2014/10/13 职场文书
实训报告范文大全
2014/11/04 职场文书
初中生物教学随笔
2015/08/15 职场文书
《你在为谁工作》心得体会(共8篇)
2016/01/20 职场文书
PyTorch device与cuda.device用法
2022/04/03 Python