[原创]javascript中如何控制动态生成的表格位置?
通过页面上的几个输入框输来确定生成表格的位置
<script>
function TestSecond()
{
var div=document.getElementById("div");
var table=document.createElement("table");
table.border=1;
var xNum=document.getElementById("textX").value;
var yNum=document.getElementById("textY").value;
var textRow=document.getElementById("textRow");
var textCell=document.getElementById("textCell");
for(var i=0;i<textRow.value;i++)
{
var row=table.insertRow();
for(var j=0;j<textCell.value;j++)
{
var cell=row.insertCell();
cell.innerText="***";
cell.width=50;
}
}
div.style.left=xNum;
div.style.top =yNum;
div.innerText="";
div.appendChild(table);
}
</script> 1
<form id="Form1" method="post" runat="server">
2
<table align="center">
3
<tr>
4
<td>行数:</td>
5
<td><input type="text" id="textRow"/>
6
</td>
7
</tr>
8
<tr>
9
<td>列数:</td>
10
<td><input type="text" id="textCell"/>
11
</td>
12
</tr>
13
<tr>
14
<td>座标X:</td>
15
<td><input type="text" id="textX"/>
16
</td>
17
</tr>
18
<tr>
19
<td>座标Y:</td>
20
<td><input type="text" id="textY"/>
21
</td>
22
</tr>
23
<tr>
24
<td align="center" colspan="2"><input type="button" value="生成表格" onClick="TestSecond();"/></td>
25
</tr>
26
</table>
27
<p>
28
29
<div id="div" style="position:absolute;">
30
</div>
31![]()
32
</form>
<form id="Form1" method="post" runat="server">2
<table align="center">3
<tr>4
<td>行数:</td>5
<td><input type="text" id="textRow"/>6
</td>7
</tr>8
<tr>9
<td>列数:</td>10
<td><input type="text" id="textCell"/>11
</td>12
</tr>13
<tr>14
<td>座标X:</td>15
<td><input type="text" id="textX"/>16
</td>17
</tr>18
<tr>19
<td>座标Y:</td>20
<td><input type="text" id="textY"/>21
</td>22
</tr>23
<tr>24
<td align="center" colspan="2"><input type="button" value="生成表格" onClick="TestSecond();"/></td>25
</tr>26
</table>27
<p>28
29
<div id="div" style="position:absolute;">30
</div>31

32
</form>


浙公网安备 33010602011771号