Question

堆栈溢出的好人，

我们正在尝试为剧院制作预订系统。我们使用脚本制作了座位图的数组，并为其提供了可点击的功能。选中后，html表显示了座位数。我们想要实现的是，该表显示了座位的价格并计算了它们。（seat_1 = 7.50 / seat_2 = 11.00 / seat_3 = 13.00）。但看起来我们非常困难。我们需要找到一种方法来使所选座位总数增加。我们的html文件接受变量，但将其视为单个主席，这意味着我们必须将价格与seat_1或count_seat_1联系起来。我们尝试添加价格，并使用字符串方法分离行和座位，但这似乎也失败了。在它显示价格和计数之后，我们需要一个按钮，它将我们带到一个新页面，其中所选座位总结在例如同一个表中但不再可更改。对不起，我们已经找了好几天，但找不到合适的方法。提前感谢您的帮助，非常感谢！我们的完整代码＆gt; http://jsfiddle.net/2fr8vzub/

亲切的问候，米歇尔。

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);

        switch(room1[r][s]) {
            case 1:
                seat.attr("id", "seat_" + r + "_" + s + "-" + 7.50);
                break;
            case 2:
                seat.attr("id", "seat_" + r + "_" + s + "-" + 11);
                break;
            case 3:
                seat.attr("id", "seat_" + r + "_" + s + "-" + 13); 
                break;
        }

        // 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];
//var p = ophalenPrijs("selected");
  $(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 start() {
   make_seat();

}
start();

保留脚本障碍

0 个答案: