JavaScript - Problema butacas cine javascript

 
Vista:
sin imagen de perfil

Problema butacas cine javascript

Publicado por Jose Antonio (1 intervención) el 24/11/2016 12:53:23
Buenas,
Quisiera que se mostrasen asientos ocupados aleatoriamente mediante la funcion math.random pero no consigo hacerlo, ademas,si selecciono un asiento ya ocupado no debería dejarme modificarlo (no funciona) y me gustaria añadirle un alert para que diga que el asiento ya esta ocupado.

Lo que quiero conseguir es:
Los asientos ya reservados sean aleatorios (sean otros al recargar la página)
Si se selecciona un asiento ya ocupado, salte un aviso.

Espero que me puedan ayudar, un saludo.

El codigo es el siguiente:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html>
    <head>
        <title>Cine</title>
        <script type="text/javascript">
            numeroasientosporfila = 8;
            nombresdelasfilas = ['1','2','3','4'];
            var statusPics = new Array();
            statusPics['libre'] = new Image();
            statusPics['seleccionado'] = new Image();
            statusPics['ocupado'] = new Image();
            statusPics['libre'].src = 'asiento_libre.png';
            statusPics['seleccionado'].src = 'asiento_seleccionado.png';
            statusPics['ocupado'].src = 'asiento_ocupado.png';
            function crearasientos(asientos,asientosfila,nombrefilas){
                for(i=0; i < nombrefilas.length; i++){
                    var filas = document.createElement('tr');
                    var columnas = document.createElement('td');
                    columnas.innerHTML = nombrefilas[i];
                    filas.appendChild(columnas);
                    for(j=0; j < asientosfila; j++){
                        columnas = document.createElement('td');
                        var imagenbutaca = document.createElement('img');
                        imagenbutaca.src = statusPics['libre'].src;
                        imagenbutaca.status = 'libre';
                        imagenbutaca.onclick=function(){
                            this.status = (this.status == 'libre')? 'seleccionado' : 'libre';
                            this.src = (this.status == 'libre')? statusPics['libre'].src : statusPics['seleccionado'].src;
                        }
                        columnas.appendChild(imagenbutaca);
                        filas.appendChild(columnas);
                    }
                    asientos.appendChild(filas);
                }
            }
            function confirmarsitios(){
                numeroasientosseleccionados = 0;
                for(i=0; i < butacas.length; i++){
                    if(butacas[i].status == 'seleccionado'){
                        ++numeroasientosseleccionados;
                        butacas[i].src=statusPics['ocupado'].src
                    }
                }
            }
            window.onload=function(){
                butacascrear = document.getElementById('crear');
                butacas = butacascrear.getElementsByTagName('img');
                crearasientos(butacascrear,numeroasientosporfila,nombresdelasfilas);
                document.getElementById('confirmar').onclick=confirmarsitios;
                document.getElementById('resetear').onclick=function(){
                    for(i=0; i < butacas.length; i++){
                        butacas[i].src = statusPics['libre'].src;
                        butacas[i].status = 'libre';
                    }
                }
            }
        </script>
    </head>
    <body>
        <div id="header"></div>
        <div id="wrapper">
            <div id="myTickets">
                <h1>Cine</h1>
                <div id="myTicket">
                    <h3>Seleccione Butaca:</h3>
                </div>
            </div>
            <div id="seating">
                <h4>Sala 1</h4>
                <table id="crear"></table>
 
                <div style="clear:both">
                </div>
                <br />
                <div id="theButtons">
                    <input type="button" value="Confirmar Asientos" id="confirmar" onclick="confirmarsitios()" />&nbsp;
                    <input type="reset" id="resetear" value="Reset" />
                </div>
            </div>
        </div>
    </body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

Problema butacas cine javascript

Publicado por star89 (1 intervención) el 29/01/2019 18:53:11
hola mi codigo es totalmente diferente yo lo he hecho asi
aunque la funcion onclick no se que error tiene pero no va

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<!DOCTYPE html>
<html>
<head>
    <title>Untitled Document</title>
    <meta charset="UTF-8">
    <meta name="description" content="">
    <meta name="keywords" content="">
</head>
<body>
 
    <script type="text/javascript">
        function butaca(){
 
            this.fila   = new Array();
            this.estado = new Array();   //0 = libre 1= ocupado y 2= reservado
            this.numero = new Array();
 
        }
 
        function iniciobutaca(numerob, filab, estadob, but){
 
            but.numero[numerob]   = numerob + 1;
            but.fila[numerob]     = filab;
            but.estado[numerob]   = estadob;
 
        }
 
        function cine(fila, butfila, butacac){
 
            this.filas      = fila;
            this.butacas    = butacac;
            this.butacafila = butfila;
 
        }
 
        function funciononcick(valor){
 
            micine.butacas.estado[valor] = 2;
            document.getElementById(valor).src = "seleccionado.png";
 
        }
 
        function funcionalerta(){
 
           alert("este asiento esta reservado");
 
        }
 
        // INICIO SCRIPT
 
        var fila = parseInt(prompt("introduce un numero de filas"));
 
        var butfila = parseInt(prompt("introduce un numero de butacas por filas"));
 
        butacas = new butaca();
 
        // iNICIOALIZAR LAS BUTACAS
        var num2 = 0;
 
        for(var filai = 1; filai <= fila; filai++){
 
            for(var butacai = 1; butacai <= butfila; butacai++ ){
 
               var estado = Math.floor((Math.random() * 2 ) + 0);
 
                num2 = (butacai +((filai-1)* butfila)) -1;
 
                iniciobutaca(num2, filai, estado, butacas);
 
            }
        }
 
         micine= new cine(fila, butfila, butacas);
 
        function mostrar(){
            var numero = 0;
            document.write("<table>");
 
            for(var filai = 1; filai <= micine.filas; filai++){
 
                document.write("<tr>");
 
                for(var butacai = 1; butacai <= micine.butacafila; butacai++ ){
 
                    //document.write("</td><img src='disponible.png'></td>");
                    numero ++;
                    console.log(numero);
                    console.log("estado numerob");
                    console.log(micine);
                    if(micine.butacas.estado[numero] == 0){
 
                        document.write("<td><img  id=' ");
                        document.write(numero);
                        document.write(" ' onclick='funciononcick(");
                        document.write(numero);
                        document.write(")' src='disponible.png'></td>");
 
                   }else{
 
                       document.write("<td><img onclick='funcionalerta()' src='reservado.png'></td>");
 
                   }
 
                }
 
                document.write("</tr>");
            }
        document.write("</table>");
 
        }
 
        mostrar();
 
    </script>
 
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar