Jsp页面动态添加表格，意思就是我点击一个按钮，就会添加一个表格。求，大神们，可以连续点击添加_IT百科

<!DOCTYPE html>

<html>

<head>

<title>RunJS</title>

$(function(){

$("button")click(function(){

var html = "<tr><td style='border:1px solid white;'>添加一行</td><td style='border:1px solid white;'>添加一行</td></tr>"; //自己定义好要添加的信息

$("table")append(html); //添加对应的内容到table

});

</script>

</head>

<body>

<button>Hello </button>

</table>

</body>

</html>

这个是简单的例子。。。

你可以在《物证材料信息的表格》外面套一个div，获取这个div的innerHTML，加入到下面即可；

只设置name，不要加id了；后台通过name获取数组。

后台循环数组添加即可

这个需要用到jstl标签和eL表达式配合使用，这样导入

<%@ taglib prefix="c" uri="http://tomcatapacheorg/core" %>

比如你servlet传来了一个list，叫studentList，那么在jsp中这样生成动态表格

<table>

<c:forEach var="student" items="${studentList}">

<tr>

<td>${studentname}</td><td>${studentage}</td><td>${studentclass}</td>

</tr>

</c:forEach>

</table>

//再详细的用法可以查一下<c:forEach>这个标签，希望对你有帮助

那个var是别名，然后在表格里的具体用法忘了，不是${studentname}就是{studentname}，你试一下就知道了

我来一点一点的回答

1 连接mysql，动态生成表格，这个动态的含义不是很明确，目前网上关于使用JDBC连接mysql数据库的文章很多，我就不复制粘贴了，请你百度一下，一大把。

2 点击或者是移动到某行，高亮显示。这里提供一个方法，在标签tr里加上onMouseOver和onMouseOut事件，配合js（或者jquery）修改css即可实现移动到某行高亮，点击的话应该是使用click事件。

3 根据你提供的，选择某行，应该是通过checkbox标签实现的，那需要使用js对checkbox标签进行事件绑定之类的。

4 跳转和d窗都很简单，在js中，使用windowopen('要跳转的页面路径','_self')进行跳转，windowopen('要d窗的页面路径','_top')进行d窗就OK了。

5 查询的跳转，请参照第4点

6 表格分页，有很多优秀的js插件可以实现你需要的效果，这里推荐一个datatables。

最后，估计以你目前的技术，要实现你需要的功能，还要多下工夫，好好专研一下js和css才行。

如果你是一窍不通，建议你抓紧时间，重头学起。只要不是太笨，或者基础太差的话，一个月时间基本上就够了。

　　可以在页面上写个循环

注意要将用到的类包，引入到当前jsp中

ArrayList list = (ArrayList) requestgetAttribute("result");

<body>

……

<table>

for(int i = 0; i < listsize(); i++) {

}

</table>

……

</body>

有问题追问吧，good luck！~

也可以用标签来实现循环

参考参考。。。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 401 Transitional//EN"

"http://wwww3org/TR/html4/loosedtd">

<html>

<head>

/生成表格，采用appendChild/

function init(){

_table=documentgetElementById("table");

_tableborder="1px";

_tablewidth="800px";

for(var i=1;i<10;i++){

var row=documentcreateElement("tr");

rowid=i;

for(var j=1;j<6;j++){

var cell=documentcreateElement("td");

cellid=i+"/"+j;

cellappendChild(documentcreateTextNode("第"+cellid+"列"));

rowappendChild(cell);

}

documentgetElementById("newbody")appendChild(row);

}

function rebulid(){

var beginRow=documentgetElementById("beginRow")value;/开始行/

var endRow=documentgetElementById("endRow")value;/结束行/

var beginCol=documentgetElementById("beginCol")value;/开始列/

var endCol=documentgetElementById("endCol")value;/结束列/

var tempCol=beginRow+"/"+beginCol;/定位要改变属性的列/

alert(tempCol);

var td=documentgetElementById(tempCol);

/删除要合并的单元格/

for(var x=beginRow;x<=endRow;x++){

for(var i=beginCol;i<=endCol;i++){

if(x==beginRow){

documentgetElementById("table")rows[x]deleteCell(i+1);

}

else{

documentgetElementById("table")rows[x]deleteCell(i);

}

tdrowSpan=(endRow-beginRow)+1;

}

/添加行，使用appendChild方法/

function addRow(){

var length=documentgetElementById("table")rowslength;

/documentgetElementById("newbody")insertRow(length);

documentgetElementById(length+1)setAttribute("id",length+2);/

var tr=documentcreateElement("tr");

trid=length+1;

var td=documentcreateElement("td");

for(i=1;i<4;i++){

tdid=trid+"/"+i;

tdappendChild(documentcreateTextNode("第"+tdid+"列"));

trappendChild(td);

}

documentgetElementById("newbody")appendChild(tr);

}

function addRow_withInsert(){

var row=documentgetElementById("table")insertRow(documentgetElementById("table")rowslength);

var rowCount=documentgetElementById("table")rowslength;

var countCell=documentgetElementById("table")rowsitem(0)cellslength;

for(var i=0;i<countCell;i++){

var cell=rowinsertCell(i);

cellinnerHTML="新"+(rowCount)+"/"+(i+1)+"列";

cellid=(rowCount)+"/"+(i+1);

}

/删除行，采用deleteRow(row Index)/

function removeRow(){

/ var row=documentgetElementById("2");

var index=rowrowIndex;

alert(index);/

documentgetElementById("newbody")deleteRow(documentgetElementById(documentgetElementById("table")rowslength)rowIndex);

}

/添加列，采用insertCell(列位置)方法/

function addCell(){

/documentgetElementById("table")rowsitem(0)cellslength

用来获得表格的列数

for(var i=0;i<documentgetElementById("table")rowslength;i++){

var cell=documentgetElementById("table")rows[i]insertCell(2);

cellinnerHTML="第"+(i+1)+"/"+3+"列";

}

/删除列，采用deleteCell(列位置)的方法/

function removeCell(){

for(var i=0;i<documentgetElementById("table")rowslength;i++){

documentgetElementById("table")rows[i]deleteCell(0);

}

</script>

</head>

</table>

<div>

</table>

</div>

<div>

</table>

</div>

</body>

</html>

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/bake/12186879.html

Jsp页面动态添加表格，意思就是我点击一个按钮，就会添加一个表格。求，大神们，可以连续点击添加

发表评论

评论列表（0条）