预约系统障碍

最亲爱的人溢出，预约系统障碍

对于一个项目，我们不得不为荷兰剧院预订系统。我们的想法是，我们根据剧院座位地图制定预订系统，其中价格因座位和排位而异，采用JavaScript制作。我们实际上制作了地图，并将数组作为可点击元素。现在我们发现了一些问题。 1.座位类0，实际上不是一个班或不应点击。我们用它来填充地图，但实际上并不知道如何将它从脚本中提取出来，而是使其在CSS文件中透明。 2.我们需要某种表格来显示选中的座位，并在点击多个时将其计数。我们非常困难，非常感谢一些帮助。亲切的问候，

韦塞尔奥尔德Olthof

<script> 
var room1 = [ 
// 1 2 3 4 5 6 7 8 9 0 1 2 
[0,0,1,1,1,1,1,1,1,1,0,0],//14 
[0,1,1,1,1,1,1,1,1,1,1,0],//13 
[0,1,1,1,1,1,1,1,1,1,1,0],//12 
[1,1,1,1,1,2,2,1,1,1,1,1],//11 
[1,1,1,1,2,2,2,2,1,1,1,1],//10 
[1,1,1,2,2,3,3,2,2,1,1,1],//9 
[1,1,1,2,2,3,3,2,2,1,1,1],//8 
[1,1,1,2,2,3,3,2,2,1,1,1],//7 
[1,1,1,2,2,3,3,2,2,1,1,1],//6 
[1,1,1,1,2,2,2,2,1,1,1,1],//5 
[0,1,1,1,1,2,2,1,1,1,1,0],//4 
[0,1,1,1,1,1,1,1,1,1,1,0],//3 
[0,0,1,1,1,1,1,1,1,1,0,0],//2 
[0,0,1,1,1,1,1,1,1,1,0,0],//1 
]; 

function make_seat() 
{ 
for(var r = 0 ; r < room1.length ; r++) 
{ 

     var rowdiv = document.createElement("div"); 

     rowdiv.setAttribute("id","DIV_" + r); 
     for(s = 0 ; s < room1[r].length ; s++) 
     { 

      var seat = document.createElement("button"); 



       seat.setAttribute("id","seat_" + r + "_" + s); 

       seat.appendChild(document.createTextNode("")); 
       //seat.addEventListener("click",reservation,false); 


       seat.setAttribute("onclick","order("+r+","+s+")"); 

       switch(room1[r][s]) 
      { 
       case 0 : seat.setAttribute("class","seat_0"); break; 
       case 1 : seat.setAttribute("class","seat_1"); break; 
       case 2 : seat.setAttribute("class","seat_2"); break; 
       case 3 : seat.setAttribute("class","seat_3"); break; 
      } 
      rowdiv.appendChild(seat); 

     } 

    document.getElementById("DIV_inhoud").appendChild(rowdiv); 
} 

} 


function order(r,s) 
{ 
alert("row = " + (r + 1) + " seat = " + (s + 1)); 
} 

function reservation(ev) 
{ 
ev = ev || window.event; 
var x = ev.target || ev.srcElement; 

alert(x.id); 
} 

function start() 
{ 
make_seat(); 
//document.getElementById("BTN_plus").addEventListener("click",optellen,false); 
//document.getElementById("BTN_maal").addEventListener("click",vermenigvuldigen,false); 
} 

window.addEventListener("load",start,false); 

</script> 
</head> 
<body> 
<DIV id = DIV_inhoud></DIV>

来源

2014-10-27 Wessel Olde Olthof

我放在一起的jsfiddle，它可能会做你想要什么。因为我使用jQuery，所以我选择在这里使用它，如果你刚刚开始使用它，这可能值得一看，因为它使得一堆事情变得更简单（或者任何其他的js库）。

http://jsfiddle.net/Moritz_M/kcu5ypka/16/

var room1 = [ 
// 1 2 3 4 5 6 7 8 9 0 1 2 
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0], //14 
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0], //13 
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0], //12 
[1, 1, 1, 1, 1, 2, 2, 1, 1, 1, 1, 1], //11 
[1, 1, 1, 1, 2, 2, 2, 2, 1, 1, 1, 1], //10 
[1, 1, 1, 2, 2, 3, 3, 2, 2, 1, 1, 1], //9 
[1, 1, 1, 2, 2, 3, 3, 2, 2, 1, 1, 1], //8 
[1, 1, 1, 2, 2, 3, 3, 2, 2, 1, 1, 1], //7 
[1, 1, 1, 2, 2, 3, 3, 2, 2, 1, 1, 1], //6 
[1, 1, 1, 1, 2, 2, 2, 2, 1, 1, 1, 1], //5 
[0, 1, 1, 1, 1, 2, 2, 1, 1, 1, 1, 0], //4 
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0], //3 
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0], //2 
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0], //1 
]; 

function make_seat() { 
for (var r = 0; r < room1.length; r++) { 

    var rowdiv = $("<div>"); 

    rowdiv.attr("id", "DIV_" + r); 
    for (s = 0; s < room1[r].length; s++) { 

     var seat = $("<button id='seat_"+r+"_"+s+"'>"); 

     seat.attr("id", "seat_" + r + "_" + s); 

     // seat.appendChild(document.createTextNode("")); 
     //seat.addEventListener("click",reservation,false); 


     seat.click(order); 
     switch (room1[r][s]) { 
      case 0: 
       seat.attr("class", "seat_0"); 
       break; 
      case 1: 
       seat.attr("class", "seat_1"); 
       break; 
      case 2: 
       seat.attr("class", "seat_2"); 
       break; 
      case 3: 
       seat.attr("class", "seat_3"); 
       break; 
     } 
     rowdiv.append(seat); 

    } 

    $("#DIV_inhoud").append(rowdiv); 
} 

} 


function order() { 
    var seatInfo = $(this).attr("id").split("_"); 
    var r = seatInfo[1]; 
    var s = seatInfo[2]; 
    $(this).toggleClass("selected"); 
    $("#count_seat_1").html($(".seat_1.selected").size()); 
    $("#count_seat_2").html($(".seat_2.selected").size()); 
    $("#count_seat_3").html($(".seat_3.selected").size()); 
    $("#count_total").html($(".selected").size()); 
} 

function reservation(ev) { 
    ev = ev || window.event; 
    var x = ev.target || ev.srcElement; 

    alert(x.id); 
} 

$(document).ready(function() { 
    make_seat(); 
    //document.getElementById("BTN_plus").addEventListener("click",optellen,false); 
    //document.getElementById("BTN_maal").addEventListener("click",vermenigvuldigen,false); 
});

来源

2014-10-27 13:18:06 Moritz

非常感谢你的工作！我definitly现在continou我的工作！非常感谢^^ – 2014-10-27 13:28:48

预约系统障碍

回答

相关问题