1. Crear selección dinámicamente
Copie el código de código de la siguiente manera:
función crearSelect(){
var mySelect = document.createElement_x("seleccionar");
miSelección.id = "miSelección";
document.body.appendChild(miSelección);
}
2. Agregar opción de opción
Copie el código de código de la siguiente manera:
función agregarOpción(){
//Buscar objetos basados en id,
var obj=document.getElementByIdx_x('mySelect');
//Añadir una opción
obj.add(new Option("text","value")); //Esto sólo es válido en IE
obj.options.add(new Option("text","value")); //Esto es compatible con IE y Firefox.
}
3. Opción Eliminar todas las opciones.
Copie el código de código de la siguiente manera:
función eliminarTodo(){
var obj=document.getElementByIdx_x('mySelect');
obj.opciones.longitud=0;
}
4. Eliminar una opción de opción.
Copie el código de código de la siguiente manera:
función eliminarUno(){
var obj=document.getElementByIdx_x('mySelect');
//index, el número de serie de la opción a eliminar, aquí toma el número de serie de la opción actualmente seleccionada
var índice=obj.selectedIndex;
obj.opciones.remove(índice);
}
5. Obtenga el valor de la opción.
var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //Número de serie, toma el número de serie de la opción seleccionada actualmente
var val = obj.opciones[índice].valor;
6. Obtenga el texto de la opción opción.
var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //Número de serie, toma el número de serie de la opción seleccionada actualmente
var val = obj.opciones[índice].texto;
7. Modificar opción opción
var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //Número de serie, toma el número de serie de la opción seleccionada actualmente
var val = obj.options[index]=nueva Opción("nuevo texto","nuevo valor");
8.Eliminar seleccionar
Copie el código de código de la siguiente manera:
función eliminarSelect(){
var miSelección = document.getElementByIdx_x("miSelección");
mySelect.parentNode.removeChild(mySelect);
}
El código completo para todo el ejemplo es el siguiente:
Copie el código de código de la siguiente manera:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//ZH-CN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<cabeza>
<meta http-equiv="Tipo de contenido" contenido="texto/html">
<cabeza>
<lenguaje de escritura=JavaScript>
función $(identificación)
{
devolver documento.getElementByIdx_x(id)
}
función mostrar()
{
var selectObj=$("área")
var myOption=document.createElement_x("opción")
myOption.setAttribute("valor","10")
myOption.appendChild(document.createTextNode("Shanghái"))
var myOption1=document.createElement_x("opción")
myOption1.setAttribute("valor","100")
myOption1.appendChild(document.createTextNode("Nanjing"))
selectObj.appendChild(miOpción)
selectObj.appendChild(miOpción1)
}
elección de función()
{
var index=$("área").selectedIndex;
var val=$("área").opciones[índice].getAttribute("valor")
si(valor==10)
{
var i=$("context").childNodes.length-1;
var remobj=$("context").childNodes[i];
remobj.removeNode(verdadero)
var sh=document.createElement_x("seleccionar")
sh.add(nueva opción("Nueva área de Pudong","101"))
sh.add(nueva opción("Distrito de Huangpu","102"))
sh.add(nueva opción("Distrito Xuhui","103"))
sh.add(nueva opción("Distrito de Putuo","104"))
$("contexto").appendChild(sh)
}
si(valor==100)
{
var i=$("context").childNodes.length-1;
var remobj=$("context").childNodes[i];
remobj.removeNode(verdadero)
var nj=document.createElement_x("seleccionar")
nj.add(nueva opción("Distrito de Xuanwu","201"))
nj.add(nueva opción("白下区","202"))
nj.add(nueva opción("Distrito de Xiaguan","203"))
nj.add(nueva opción("Distrito de Qixia","204"))
$("contexto").appendChild(nj)
}
}
funcióncalc()
{
var x=$("context").childNodes.length-1;
alerta(x)
}
función eliminar()
{
var i=$("context").childNodes.length-1;
var remobj=$("context").childNodes[i];
remobj.removeNode(verdadero)
}
</script>
<cuerpo>
<div id="contexto">
<seleccione id="área" onchange="elección()">
</seleccionar>
</div>
<tipo de entrada=valor del botón="Mostrar" al hacer clic="mostrar()">
<tipo de entrada=valor del botón="nodo de cálculo" onclick="calc()">
<tipo de entrada=valor del botón="Eliminar" onclick="eliminar()">
</cuerpo>
</html>
Versión mejorada: agregue, modifique y elimine elementos de opción en la selección
Copie el código de código de la siguiente manera:
función watch_ini(){ // inicial
for(var i=0; i<argumentos.longitud; i++){
var palabra = document.createElement_x("OPCIÓN");
palabra.texto = argumentos[i];
watch.keywords.add(word); // watch es el nombre del formulario.
}
}
función watch_add(f){ // agregar
var palabra = document.createElement_x("OPCIÓN");
palabra.texto = f.palabra.valor;
f.palabras clave.add(palabra);
}
Sin embargo, el método add() anterior solo es válido en IE. Para que sea compatible con FF y Opera, el código anterior se ha mejorado y el código modificado es el siguiente.
Copie el código de código de la siguiente manera:
función watch_ini(){ // inicial
for(var i=0; i<argumentos.longitud; i++){
var oOption=nueva opción(argumentos[i],argumentos[i]);
document.getElementByIdx_x("MySelect")[i]=oOption;
}
}
función watch_add(f){ // agregar
var oOption=nueva opción(f.word.value,f.word.value);
f.palabras clave[f.palabras clave.longitud]=oOpción;
}
El código completo para todo el ejemplo es el siguiente:
Copie el código de código de la siguiente manera:
<!doctype html public "-//w3c//dtd html 4.0 transicional//es">
<html>
<cabeza>
<título>valor de texto de opciones de selección de javascript</título>
<meta name="palabras clave" content="javascript seleccionar opciones texto valor agregar modificar eliminar conjunto">
<meta name="descripción" contenido="javascript seleccionar opciones texto valor agregar modificar eliminar conjunto">
<lenguaje de escritura="javascript">
<!--
función watch_ini(){ // inicial
for(var i=0; i<argumentos.longitud; i++){
var oOption=nueva opción(argumentos[i],argumentos[i]);
document.getElementByIdx_x("MySelect")[i]=oOption;
}
}
función watch_add(f){ // agregar
var oOption=nueva opción(f.word.value,f.word.value);
f.palabras clave[f.palabras clave.longitud]=oOpción;
}
función watch_sel(f){ // Editar
f.palabra.valor = f.palabras clave[f.palabras clave.selectedIndex].text;
}
función watch_mod(f){ // Modificar
f.palabras clave[f.palabras clave.selectedIndex].text = f.palabra.valor;
}
función watch_del(f){ // Eliminar
f.palabras clave.remove(f.palabras clave.selectedIndex);
}
función watch_set(f){ // guardar
conjunto var = "";
for(var i=0; i<f.palabras clave.length; i++){
establecer += f.palabras clave[i].texto + ";";
}
confirmar(establecer);
}
//-->
</script>
</cabeza>
<cuerpo>
<formulario nombre="ver" método="publicar" acción="">
<select id="MySelect" name="palabras clave" size="10" onchange="watch_sel(this.form)"></select><br>
<lenguaje de escritura="javascript">
<!--
watch_ini("Yo","Tú","Él","Ella","Eso","Er");
//-->
</script>
<tipo de entrada="texto" nombre="palabra" /><br />
<tipo de entrada="botón" valor="Agregar" onclick="watch_add(this.form);"
<tipo de entrada="botón" valor="Modificar" onclick="watch_mod(this.form);"
<tipo de entrada="botón" valor="Eliminar" onclick="watch_del(this.form);"
<tipo de entrada="botón" valor="Guardar" onclick="watch_set(this.form);"
</formulario>
Cree un método de matriz a partir de una cadena:
Copie el código de código de la siguiente manera:
<lenguaje de escritura="javascript">
</cuerpo>
</html>
<guión>
función dividir(){
cadena de datos="2,2,3,5,6,6";
var str= nueva matriz();
str=datastr.split(",");
para (i=0;i<cadena.longitud;i++)
{ documento.write(str[i]+"<br/>");
}
dividir();
</script>
Depuré un fragmento de js hoy y funcionó bien en IE. Sin embargo, se produjo un error al depurar en Firefox. Verifiqué la información y encontré que.
obj.add(new Option("text","value")); //Esto sólo es válido en IE
obj.options.add(new Option("text","value")); //Esto es compatible con IE y Firefox
Debido a este código, busqué información en Internet y recopilé este artículo para revisar los js antiguos en tiempo real.