-
Cómo cambiar un desplegable de Indice en JavaScript
-
JavaScript le da la capacidad de cambiar dinámicamente el contenido en la pantalla del navegador del usuario porque el guión reside y se ejecuta dentro del navegador del usuario. Por ejemplo, se puede cambiar un valor de índice desplegable en JavaScript consiguiendo valor de índice del elemento de la <select> array y el cambio de la propiedad de texto de ese elemento. Debe asignar un nombre a la forma y al elemento <select> en la forma de hacer que sea fácil de hacer referencia a ellos.
Instrucciones
1 Crear una página web que permitirá a los usuarios para ordenar los suministros y va a cambiar el nombre del elemento en "Agotado" cuando no hay más a la izquierda. Crear un documento HTML con el Bloc de notas o un editor HTML y añadir las cabeceras HTML al documento:
<! DOCTYPE HTML>
<Html lang = "es">
<Head>
<Charset meta = "UTF-8">
<Title> Pedir suministros </ title>
2 Añadir un código Javascript para realizar un seguimiento del inventario y cambiar el nombre del elemento para Agotado cuando el inventario se va a cero. Inicializar las variables globales con el inventario inicial para cada elemento:
<Script>
lápices var = 5;
papel var = 5;
grapadoras var = 5;
3 Crear una función de JavaScript que recibe el elemento seleccionado cuando el usuario hace clic en un botón de orden. Utilice la propiedad "selectedIndex" para obtener el índice de elemento y la propiedad "Texto" para obtener su nombre:
Para function () {
var index = document.supplies.items.selectedIndex;
artículos var = document.supplies.items [índice] .text;
4 Establecer un indicador que indica un artículo en que se vende a nombre de "falsa"
var soldOut = false;
5 Disminuir el inventario para el elemento seleccionado. Si el inventario cae a cero, cambiar el texto índice desplegable para "Agotado"
switch (items) {
caso "lápiz":
--pencils;
si (lápices == 0) soldout = true;
descanso;
caso "papel":
--papel;
si (papel == 0) soldout = true;
descanso;
caso "grapadora":
--staplers;
si (grapadoras == 0) soldout = true;
descanso;
}
si (VENDIDO) document.supplies.items [índice] .text = "Agotado";
}
</ Script>
</ Head>
6 Crear el formulario HTML y asignarle el nombre que utilizó en la función JavaScript. Crear el cuadro desplegable con la etiqueta <select> y utilice el nombre de la función JavaScript. Añadir los artículos con la etiqueta <option> y añadir un botón para llamar a la función de JavaScript:
<Body>
<Form name = "suministros">
<Select name = "elementos">
<Opción> Lápiz </ option>
<Opción> Papel </ option>
<Opción> grapadora </ option>
</ Select>
<Input type = "button" name = "addtoorder" value = "orden" onclick = "fin ();">
</ Form>
</ Body>
</ Html>
7 Guarde el archivo HTML. Abrirlo en un navegador y probar la funcionalidad.