jquery 追加tr和删除tr

<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
02 <script>
03 $(function(){  
04     $("#getAtr").click(function(){          
05         $str='';
06         $str+="<tr align='center'>";
07         $str+="<td><input type='text' name='advTitle[]'/></td>";
08         $str+="<td><input type='file' name='img[]' /></td>";
09         $str+="<td><input type='text' name='advContent[]' /></td>";
10         $str+="<td><input type='text' name='advSource[]' /></td>";
11         $str+="<td><input type='text' name='advAuthor[]' /></td>";
12         $str+="<td><input type='text' name='advPosition[]' /></td>";
13         $str+="<td onClick='getDel(this)'><a href='#'>删除追加</a></td>";    
14         $str+="</tr>";
15         $("#addTr").append($str);   
16     });
17 });
18  
19 function getDel(k){
20     $(k).parent().remove();    
21 }
22 </script>
23  
24 --------------------------------------------------------------------------------
25 html部分
26 <table align="center" border="1" cellpadding="0" cellspacing="0" width="100%">
27  <tr align="center">
28    <td>广告名称</td>
29    <td>广告图片</td>
30    <td>广告内容</td>
31    <td>广告来源</td>
32    <td>广告作者</td>
33    <td>广告描述</td>
34    <td align="center"><a href="#" id="getAtr">追加内容</a></td>
35  </tr>
36 <tbody id="addTr">
37  <tr align="center">
38    <td><input type="text" name="advTitle[]"/></td>
39    <td><input type="file" name="img[]" /></td>
40    <td><input type="text" name="advContent[]" /></td>
41    <td><input type="text" name="advSource[]" /></td>
42    <td><input type="text" name="advAuthor[]" /></td>
43    <td><input type="text" name="advPosition[]" /></td>
44    <td></td>
45   </tr>
46 </tbody>
47  <tr align="center">
48   <td colspan="5"><input type="submit" value="全部添加" /></td>
49  </tr>
50 </table>

posted on 2013-11-03 14:13  anuo_ruibo  阅读(471)  评论(0编辑  收藏  举报

导航