Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » Crear un input a partir de un select

JavaScript - Crear un input a partir de un select

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil
Val: 33
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear un input a partir de un select

Publicado por Javier (22 intervenciones) el 10/04/2020 08:02:20
Buenas amigos, tengo un problema al intentar crear un input si se selecciona una opción en un select por ejemplo si yo selecciono Arial quiero intentar que aparezca un input extra solo en esa seleccion, sera posible? y muchas gracias por toda su ayuda

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE html>
<head>
	<link rel="stylesheet" type="text/css" href="css/estilos.css">
	<meta charset="utf8">
	<script>
	function mostrar(objeto)
	{
		if(objeto.value==0)
		{
			document.getElementById("idSeleccionado").value="text";
			document.getElementById("textoSeleccionado").value="";
		}else{
			document.getElementById("idSeleccionado").value=objeto.value;
			document.getElementById("textoSeleccionado").value=objeto[objeto.value].innerHTML;
		}
	}
	</script>
</head>
 
<body>
	<select onchange="mostrar(this)">
		<option value="a" selected="selected">Selecciona una opción</option>
		<option value="font-family: arial;" class="betosierra">Arial</option>
		<option value="font-family: cursive;" class="betoquintanilla">Cursive</option>
		<option value="d">opcion 3</option>
		<option value="f">opcion 4</option>
		<option value="g">opcion 5</option>
	</select>
 
	<p>
		Codigo CSS <input type="text" id="idSeleccionado">
 
	</p>
 
	<input type="text" name="holiwis" class="holiwis">
</body>
 
</html>
Captura
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear un input a partir de un select

Publicado por ScriptShow (692 intervenciones) el 10/04/2020 14:22:31
Saludos,

una opción posible y adaptable:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
 
<head>
<link rel="stylesheet" type="text/css" href="css/estilos.css">
<meta charset="utf8">
<script>
function mostrar(){
var sel=document.getElementById("select").selectedIndex;
var opt=document.getElementById("select").options;
document.getElementById("idSeleccionado").value=opt[sel].value;
document.getElementById("textoSeleccionado").value=opt[sel].text;
}
</script>
}
</script>
</head>
<body>
<select id="select" onchange="mostrar()">
<option value="a" selected="selected">Selecciona una opción</option>
<option value="font-family: arial;" class="betosierra">Arial</option>
<option value="font-style: italic;" class="betoquintanilla">Cursive</option>
<option value="d">opcion 3</option>
<option value="f">opcion 4</option>
<option value="g">opcion 5</option>
</select>
<p>
Codigo CSS <input type="text" id="idSeleccionado">
</p>
Fuente <input type="text" name="holiwis" class="holiwis" id="textoSeleccionado">
</body>
</html>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 33
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear un input a partir de un select

Publicado por Javier (22 intervenciones) el 11/04/2020 22:35:55
Muchisimas gracias amigo!! pero es posible que solo se cree el input cuando eligo la opcion "Arial" y con las demas opciones no? muchas gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Crear un input a partir de un select

Publicado por ScriptShow (692 intervenciones) el 12/04/2020 14:08:45
Saludos,

veamos una posibilidad:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
 
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/estilos.css">
<meta charset="utf8">
<script>
function mostrar(){
var opt=document.getElementById("select").options;
var sel=document.getElementById("select").selectedIndex;
document.getElementById("idSeleccionado").value=opt[sel].value;
if (opt[sel].text=="Arial"){document.getElementsByTagName("p")[1].innerHTML='Fuente CSS <input type="text" id="" value="Arial">';}
else {document.getElementsByTagName("p")[1].innerHTML="";}
}
</script>
</head>
<body>
<select id="select" onchange="mostrar()">
<option value="a" selected="selected">Selecciona una opción</option>
<option value="font-family: arial;" class="betosierra">Arial</option>
<option value="font-style: italic;" class="betoquintanilla">Cursive</option>
<option value="d">opcion 3</option>
<option value="f">opcion 4</option>
<option value="g">opcion 5</option>
</select>
<p>
Codigo CSS <input type="text" id="idSeleccionado">
</p>
<p>
...
</p>
</body>
</html>

Espro sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar