Ejercicios (sesiones) - Sesiones (1) - Enunciados

Para facilitar la realización de los ejercicios, se proporcionan unas plantillas de los ejercicios Sesiones (1).

Se pueden descargar unas posibles soluciones de estos ejercicios en la página de soluciones.

Nota:

Comprobación de formularios

Sesiones (1) 01 - Formulario Texto (1)

Escriba un programa de dos páginas que solicite un texto al usuario y lo muestre en las dos páginas.

ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Sesiones (1) 02 - Formulario Texto (2)

Modifique el programa anterior de manera que la segunda página no muestre ningún mensaje, sino que redirija a la primera.

ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Sesiones (1) 03 - Formulario palabra en mayúsculas

Modifique el programa anterior de manera que:

ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Sesiones (1) 04 - Formulario palabra en mayúsculas y palabra en minúsculas

Modifique el programa anterior de manera que haya dos controles:

ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Gráficos

Sesiones (1) 11 - Subir y bajar número

Escriba un programa de dos páginas que muestre un valor numérico y permita subirlo o bajarlo mediante dos botones.

Ayuda
  • El código HTML podría ser el siguiente (con los valores que cambian resaltados):
    <p>
      <button type="submit" name="accion" value="bajar" style="font-size: 4rem">-</button>
      <span style="font-size: 4rem">0</span>
      <button type="submit" name="accion" value="subir" style="font-size: 4rem">+</button>
    </p>
    
ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Sesiones (1) 12 - Mover un punto a derecha e izquierda

Escriba un programa de dos páginas que muestre un punto sobre una línea y permita moverlo a derecha o izquierda mediante dos botones.

Ayuda
  • El código HTML podría ser el siguiente (con los valores que cambian resaltados):
    <th>
      <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
        width="600" height="20" viewbox="-300 0 600 20">
        <line x1="-300" y1="10" x2="300" y2="10" stroke="black" stroke-width="5" />
        <circle cx="0" cy="10" r="8" fill="red" />
      </svg>
    </th>
    
ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Sesiones (1) 13 - Mover un punto en dos dimensiones

Escriba un programa de dos páginas que muestre un punto en un cuadrado y permita moverlo en vertical u horizontal mediante cuatro botones.

Ayuda
  • El código HTML podría ser el siguiente (con los valores que cambian resaltados):
    <td>
      <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
        width="400" height="400" viewbox="-200 -200 400 400" style="border: black 2px solid">
        <circle cx="0" cy="0" r="8" fill="red" />
      </svg>
    </td>
    
ERROR (no puede mostrarse el objeto)
Enlace a ejemplo

Sesiones (1) 14 - Votar una opción

Escriba un programa de dos páginas que muestre gráficamente los votos recogidos por dos opciones.

Ayuda
  • El código HTML podría ser el siguiente (con los valores que cambian resaltados):
    
    <tr>
      <td style="vertical-align: top;"><button type="submit" name="accion" value="a" style="font-size: 60px; line-height: 50px; color: hsl(200, 100%, 50%);">✔</button></td>
      <td>
        <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
          width="30" height="50">
          <line x1="0" y1="25" x2="30" y2="25" stroke="hsl(200, 100%, 50%)" stroke-width="50" />
        </svg>
      </td>
    </tr>
    <tr>
      <td><button type="submit" name="accion" value="b" style="font-size: 60px; line-height: 50px; color: hsl(35, 100%, 50%)">✔</button></td>
      <td>
        <svg version="1.1" xmlns="http://www.w3.org/2000/svg"
          width="40" height="50">
          <line x1="0" y1="25" x2="40" y2="25" stroke="hsl(35, 100%, 50%)" stroke-width="50" />
        </svg>
      </td>
    </tr>
    
ERROR (no puede mostrarse el objeto)
Enlace a ejemplo