HTML - input TELEFONO con los codigos de cada pais

 
Vista:
sin imagen de perfil

input TELEFONO con los codigos de cada pais

Publicado por Luis Paredes (4 intervenciones) el 11/12/2016 07:47:59
LA cuestión es que estoy implementando en un proyecto los datos de perfil de cada persona y quiero agregar un input para que el usuario pueda agregar tu número de teléfono, pero me gustaria que al seleccionar el pais en el que se encuentre el sistema muestre el código de ese pais... he visto que aparece una como banderita en ele mismo input... eso estaria genial...
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 kip
Val: 53
Ha aumentado su posición en 2 puestos en HTML (en relación al último mes)
Gráfica de HTML

input TELEFONO con los codigos de cada pais

Publicado por kip (12 intervenciones) el 11/12/2016 17:30:48
Hola, no es tan dificil aqui te dejo un ejemplo simple para que pruebes:

En funcionamiento:
https://jsfiddle.net/em2wjhqh/4/

HTML
1
2
3
4
5
6
7
8
<select id="pais">
<option value="">SELECCIONE UN PAIS</option>
<option value="+54">ARGENTINA</option>
<option value="+56">CHILE</option>
<option value="+52">MEXICO</option>
</select>
<br>
<input type="text" id="telf" disabled="disabled"/>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script>
var pais = document.getElementById('pais');
var telf = document.getElementById('telf');
 
pais.onchange = function(e) {
	telf.value = this.value;
	if((this.value).trim() != '') {
		telf.disabled = false;
	} else {
		telf.disabled = true
	}
}
 
telf.onkeyup = function(e) {
	var nums_v = this.value.match(/\d+/g);
	if (nums_v != null) {
		this.value = '+'+((nums_v).toString().replace(/\,/, ''));
	} else {
		this.value = pais.value;
	}
}
</script>

Lo de la bandera de los paises podria manejarse de igual forma como en el ejemplo, todo dependera del valor del select.
Tambien en el codigo javascript hice que solo se puedan ingresar numeros y no letras en el input.

Ten en cuenta que debes colocar el codigo javascript antes del cierre de etiqueta del body y funcionaria.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar
sin imagen de perfil

input TELEFONO con los codigos de cada pais

Publicado por Luis Paredes (4 intervenciones) el 11/12/2016 20:00:16
Esta excelente amigo, es justo lo que buscaba.. mil gracias... por tu ayuda.
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

input TELEFONO con los codigos de cada pais

Publicado por Luis Paredes (4 intervenciones) el 13/12/2016 17:07:28
El codigo me funciona a la perfección, he estado buscando como loco los input de los codigos de cada pais, encontré varios en internet pero solo la lista, sin formatos de input... no si haya alguna parte donde esten los input con la lista de paises completos...
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