Control SELECT

PROBLEMAS

  1. Confeccionar una página que muestre un objeto SELECT con distintos tipos de pizzas (Jamón y Queso, Muzzarella, Morrones). Al seleccionar una, mostrar en un objeto de tipo TEXT el precio de la misma.
  2. Generar un presupuesto de un equipo de computación a partir de tres objetos de tipo SELECT que nos permiten seleccionar:
    Procesador (Intel I3 - $400, Intel I5 $600, Intel I7 $800).
    Monitor (Samsung 20' - $250, Samsung 22' - $350, Samsung 26' - $550)
    Disco Duro(500 Gb - $300, 1 Tb - $440, 3 Tb - $500)
    Para cada característica indicamos string a mostrar (Ej. Intel I3) y el valor asociado a dicho string (Ej. 400).
    Al presionar un botón "Calcular" mostrar el presupuesto en un objeto de tipo TEXT.
  3. Confeccionar una página que permita seleccionar una pizza y la cantidad de unidades. Luego al presionar un botón calcular el importe a pagar.
    Utilizar un objeto de la clase SELECT para la selección de la pizza, pudiendo ser:
    Queso: $ 4.
    Jamón y queso: $ 6.
    Especial: $ 10.
    A la cantidad de pizzas cargarla en un objeto de la clase TEXT y en otro objeto de la clase TEXT mostrar el importe total a abonar.
  4. Confeccionar una página que permita tomar un examen múltiple choice. Se debe mostrar una pregunta y seguidamente un objeto SELECT con las respuestas posibles. Al presionar un botón mostrar la cantidad de respuestas correctas e incorrectas (Disponer 4 preguntas y sus respectivos controles SELECT)
Solución 
Problema 1.


<html>
<head>
</head>
<body>

<script type="text/javascript">
  function mostrarSeleccionPizza()
  {
    document.getElementById('mensaje').value=document.getElementById('pizza').options[document.getElementById('pizza').selectedIndex].text;
  }
</script>

<form>
Pizzas:
<select id="pizza" onChange="mostrarSeleccionPizza()">
  <option>Jamon y Queso</option>
  <option>Muzzarella</option>
  <option>Morrones</option>
</select>
<br>
<input type="text" id="mensaje">
</form>

</body>
</html>
     


Problema 2.


<html>
<head>
</head>
<body>

<script type="text/javascript">
  function calcularPresupuesto()
  {
    var ele1=document.getElementById('procesador')
    var precio1=ele1.options[ele1.selectedIndex].value;
    var ele2=document.getElementById('monitor')
    var precio2=ele2.options[ele2.selectedIndex].value;
    var ele3=document.getElementById('discoduro')
    var precio3=ele3.options[ele3.selectedIndex].value;
    precio1=parseInt(precio1);
    precio2=parseInt(precio2);
    precio3=parseInt(precio3);
    var suma=precio1+precio2+precio3;
    document.getElementById('resultado').value=suma;
  }
</script>

<form>
Procesador:
  <select id="procesador">
    <option value="400">Intel I3</option>
    <option value="600">Intel I5</option>
    <option value="800">Intel I7</option>
  </select>
  <br>
Procesador:
  <select id="monitor">
    <option value="250">Monitor Samsung 20'</option>
    <option value="350">Monitor Samsung 22'</option>
    <option value="550">Monitor Samsung 26'</option>
  </select>
  <br>
Disco duro:
  <select id="discoduro">
    <option value="300">Disco Duro 500 Gb</option>
    <option value="440">Disco Duro 1 Tb</option>
    <option value="500">Disco Duro 3 Tb</option>
  </select>
  <br>
<input type="button" value="Calcular Presupuesto" onClick="calcularPresupuesto()">
<br>
<input type="text" id="resultado">
</form>

</body>
</html>



Problema 3.


<html>
<head>
</head>
<body>

<script type="text/javascript">
  function calcularPresupuesto()
  {
    var precio=document.getElementById('pizza').value;
    precio=parseInt(precio);
    var cantidad=document.getElementById('cantidad').value;
    cantidad=parseInt(cantidad);
    var total=precio*cantidad;
    document.getElementById('resultado').value=total;
  }
</script>

<form>
Seleccione la pizza:
<select id="pizza">
  <option value="4">Queso</option>
  <option value="6">Jamon y Queso</option>
  <option value="10">Especial</option>
</select>
<br>
Cantidad de pizzas:
<input type="text" id="cantidad">
<br>
<input type="button" value="Calcular costo" onClick="calcularPresupuesto()">
<br>
<input type="text" id="resultado">
</form>

</body>
</html>



Problema 4.


<html>
<head>
</head>
<body>

<script type="text/javascript">
  function verificar()
  {
    var correctas=0;
    var ele1=document.getElementById('pregunta1');
    var ele2=document.getElementById('pregunta2');
    var ele3=document.getElementById('pregunta3');
    var ele4=document.getElementById('pregunta4');
    if (ele1.options[ele1.selectedIndex].value==3)
    {
      correctas++;
    }
    if (ele2.options[ele2.selectedIndex].value==1)
    {
      correctas++;
    }
    if (ele3.options[ele3.selectedIndex].value==2)
    {
      correctas++;
    }
    if (ele4.options[ele4.selectedIndex].value==2)
    {
      correctas++;
    }
    alert('Cantidad de respuestas correctas:'+correctas);
  }
</script>

<form>
Como se dice rojo en ingles:<br>
  <select id="pregunta1">
    <option value="1">blue</option>
    <option value="2">green</option>
    <option value="3">red</option>
  </select>
  <br>
Como se dice ventana en ingles:<br>
  <select id="pregunta2">
    <option value="1">window</option>
    <option value="2">door</option>
    <option value="3">bedroom</option>
  </select>
  <br>
Como se dice gato en ingles:<br>
  <select id="pregunta3">
    <option value="1">dog</option>
    <option value="2">cat</option>
    <option value="3">lion</option>
  </select>
  <br>
Como se dice hombre en ingles:<br>
  <select id="pregunta4">
    <option value="1">women</option>
    <option value="2">man</option>
    <option value="3">child</option>
  </select>
  <br>
  <input type="button" value="Controlar" onClick="verificar()">
</form>
</body>
</html>


Retornar al menu