Heim > Web-Frontend > HTML-Tutorial > 如何设计一个可以增加行的表格?_html/css_WEB-ITnose

如何设计一个可以增加行的表格?_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:38:27
Original
1309 Leute haben es durchsucht

  <tr>    <td>1</td>      </tr>  <tr>    <td>2</td>      </tr>  <tr>    <td>3</td>      </tr>  <tr>    <td>4</td>      </tr>  </table>
Nach dem Login kopieren

忽然发现如果公司继续需要表格的行呢,用什么方法增加?


回复讨论(解决方案)

js代码:插入行

table.insertRow(i)//插入第(i+1)行,行数(参数)从零开始 
Nach dem Login kopieren

向表格中动态添加行显示信息,做到滚动效果

参考jquery:

http://www.blogjava.net/absolutedo/archive/2009/03/13/259488.html

你也可以试试easy ui 的datagrid,可以从后台获取数据,也可以从前台进行调用js增加行

http://www.jeasyui.net/demo/338.html

干脆把table也设计成动态的,把增加行设计成一个方法

可以参考下该案例,添加行的方式自行定义

nbsp;html>




表格添加行

















<script></script>
<script> <br /> $(function(){ <br /> $("#add").click(function(){ <br /> var row="<tr>"+ <br /> "<td>4"+ <br /> "<td>4"+ <br /> ""; <br /> $("table").append(row); <br /> }); <br /> }) <br /> </script>
1 1
2 2
3 3


Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage