Question

我是javascript新手并尝试新事物。是否可以将这些重复图像中的每一个存储在tr中并且有5个单独的行？我每次座位达到20（19）时都会有一个中断标签，但我更喜欢将它放在行标签中。我希望它在表格中的原因是我可以在每个图像下显示数字/文本，以便用户知道分配给每个图像的数字/文本是什么。我真的很感激别人的意见。

我的代码低于

<script type="text/javascript">

var x= new Array(100);
var myseat="";
var test="";
var noseats=0;
var seatcounter=0;  

function seatgen()
{

   for(i=0;i<100;i++)
   {
      myseat+="<img src='seat_avail.png' onclick='mycheck(this,"+i+")'  width='45' height='70'>";          /*alt='seat"+i+"' id='mys"+i+"' onclick='mycheck("+i+")'*/

      if( (i+1) % 20 == 0 ){ myseat+="<br>" }

      x[i] = "available";
   }

   document.getElementById("seathere").innerHTML=myseat;
   noseats=prompt("How many seats would you like to book","10" );

}


function mycheck(k, p)
{
   if( x[p] != "available" ){
      alert("Not available");
   } else if( seatcounter == noseats ) {
      alert("Reacher max seats");
   } else {
      k.src='seat_select.png';
      x[p]="unavailable";
      seatcounter+=1;
   }
}

</script>

Answer 1

更改为：

function seatgen()
{

 myseat = "<table><tr>"; // open table and first row

 for(i=0;i<100;i++)
 {
   myseat+="<td><img src='seat_avail.png' onclick='mycheck(this,"+i+")'  width='45' height='70'></td>";         

   if((i+1)%20==0){myseat+="</tr><tr>"} // close row, start new one
   x[i]="available";
 }

 myseat += "</tr></table>"; // close last row and table

这将生成每行包含20张图像的行，每行包含一个表格单元格。

修改：工作fiddle here

Answer 2

每一行都需要在块内。

myseat+="<table>";
for(i=0;i<100;i++)
{
    myseat+="<img src='seat_avail.png' onclick='mycheck(this,"+i+")'  width='45' height='70'>";         

   if((i+1)%20==0){myseat="<tr><td>"+myseat+"</tr></td>"}
   x[i]="available";
}

myseat+="</table>";

我如何使用超过<br/>图像

2 个答案: