Este ejemplo comparte el menú desplegable de enlace secundario de implementación JS para su referencia. El contenido específico es el siguiente
<%@ page lenguaje = "java" import = "java.util.*" pageEncoding = "utf-8"%> <%string path = request.getContextPath (); String basepath = request.getScheme ()+": //"+request.getServerNeN ()+":"+request.getServerPort ()+pATH+"/";%; "-// w3c // dtd html 4.01 transitional // en"> <html> <fead> <title> nuevo documento </title> <meta name = "generador" content = "editplus"> <meta name = "autor" Content = ""> <meta name = "Keywords" Content = ""> <meta name = "Descript" Content = "<Script <script <script" Script "JavaScript" JavaScript " Type = "Text/JavaScript"> // Define una matriz bidimensional de ciudades, y el orden en ella es el mismo que el de las provincias. Get the subscript value of the province by selectedIndex to get the corresponding city array var city=[ ["Beijing","Tianjin","Shanghai","Chongqing"], ["Nanjing","Suzhou","Nantong","Changzhou"], ["Fuzhou","Fuan","Longyan","Nanping"], ["Guangzhou", "Chaoyang", "Chaozhou", "Chenghai"], ["Lanzhou", "baiyin", "dingxi", "dunhuang"]]; función getCity () {// Obtener el objeto del cuadro desplegable de la provincia var sltProvince = document.form1.province; // Obtener el objeto del cuadro desplegable de la ciudad var sltcity = document.form1.city; // Obtenga el var de la matriz de la ciudad de la provincia de provincia correspondiente = ciudad [sltprovince.selectedIndex - 1]; // borrar el cuadro desplegable de la ciudad, dejando solo la opción de inmediato sltcity.length = 1; // llena el valor en la matriz de la ciudad en el cuadro desplegable de la ciudad para (var i = 0; i <provincidad.length; i ++) {sltcity [i+1] = nueva opción (provincidad [i], provincidad [i]); }} </script> </head> <body> <form de método = post accy = "" name = "form1"> <select name = "provincia" onchange = "getCity ()"> <opción valor = "0"> Seleccione su provincia </opción> <opción valor = "gansu"> ciudad </opción> <valiente de jiANGSU "Province" Provincia "> Provincia de Fujian </opción> <opción value =" provincia de Guangdong "> Provincia de Guangdong </opción> <opción value =" provincia gansu "> provincia de gansu </opción> </select> <select name =" ciudad "> <opción valor =" 0 "> Seleccione su ciudad </select> </form> </body> </html>Este código es relativamente simple.
Si no está familiarizado con JS, puede echar un vistazo al siguiente contenido sobre JS Processing Select Objects :
1. Use la propiedad selectedIndex para obtener el índice de la opción actual
Las opciones en el cuadro desplegable son una matriz lineal, cada opción tiene un índice y el seleccionado INDEX representa el número de índice de la opción seleccionada actualmente. Combinado con el atributo de opciones, se puede obtener el objeto de opción seleccionado, para que se pueda procesar más. Cuando el cuadro desplegable es seleccionable múltiple, la propiedad SelectedIndex devuelve el primer índice seleccionado.
SelectedIndex es una propiedad de solo lectura. Si desea establecer el elemento en el cuadro desplegable especificado a través del índice en el estado seleccionado, puede establecer el seleccionado = true del objeto de opción para lograrlo.
2. Agregue una opción al objeto Seleccionar
sltcity [i+1] = nueva opción (provincidad [i], provincidad [i]);
Nueva opción (Provincidad [i], Provincidad [i]) significa crear un objeto de opción con la provincia de valor [i] y el texto es provincidad [i]. Sltcity es el objeto de la ciudad en la página. I+1 especifica la ubicación de la opción recién agregada.
3. Borrar un objeto seleccionado
Hay dos formas de eliminar todas las opciones en el cuadro desplegable.
El primer método es atravesar la eliminación:
var l = myselect.length; for (var i = 0; i <l; i ++) {mySelect.options [i] = null; }El segundo método es relativamente simple, por lo que este método se usa generalmente:
myselect.length = 0;