Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » Problema con onBlur

JavaScript - Problema con onBlur

Volver
Nuevo Tema
<<>>
 
Vista:
Imágen de perfil de Rafael

Problema con onBlur

Publicado por Rafael (2 intervenciones) el 16/03/2015 07:47:51
A ver si me podéis ayudar.

He creado un fichero onblur.php con el siguiente código:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<body>
 
<?php echo "<p>".$_GET['texto']."</p>"; ?>
<form action="onblur.php">
Ponga un texto en minúsculas: <input type="text" id="texto" name="texto" onblur="myFunction();">
<button type="submit">Ok</button>
</form>
 
<script>
function myFunction() {
var x = document.getElementById("texto");
x.value = x.value.toUpperCase();
}
</script>
 
</body>
</html>

El problema es que no siempre me funciona. Es un ejemplo muy sencillo que al salir del campo de texto lo convierte en mayúsculas. Si en lugar de salir con TAB pulsamos Intro, no funciona.

Supongo que el problema está en que el DOM se destruye antes de ejecutarse el script, pero no estoy seguro.

La función que quiero ejecutar es mucho más compleja y modifica dos campos ocultos localizados con getElementById que luego son devueltos por el formulario.

Supongo que es una tontería, pero de verdad que me estoy volviendo loco.
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 xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Problema con onBlur

Publicado por xve (2100 intervenciones) el 16/03/2015 09:55:53
Hola Rafael, al pulsar la tecla enter, se ejecuta el evento submit sin perder el foco del input, por esa razón no se ejecuta la función...

Para que te funcione, tienes que añadir el evento onchange... algo así:
1
<input type="text" id="texto" name="texto" onblur="myFunction();" onchange="myFunction();">

Coméntanos si te sirve, ok?
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 Rafael

Problema con onBlur

Publicado por Rafael (2 intervenciones) el 16/03/2015 13:01:08
Finalmente lo he tenido que resolver de otra forma... Os paso el código completo por lo podéis revisar, que soy nuevo en ésto ;)

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<html>
<body>
 
<?php
var_dump($_GET);
?>
<form action="blur.php">
<div>
<input type="text" id='latitud0' name="latitud0" readonly>
<input type="text" id='longitud0' name="longitud0" readonly>
Texto1: <input type="text" id="direccion0" name="direccion0" onkeypress="if (event.which == 13) {geoloc(vMarkers,0);return false;}" onblur="myFunction(0);">
</div>
<div>
<input type="text" id='latitud1' name="latitud1" readonly>
<input type="text" id='longitud1' name="longitud1" readonly>
Texto2: <input type="text" id="direccion1" name="direccion1" onkeypress="if (event.which == 13) {geoloc(vMarkers,1);return false;}" onblur="myFunction(1);">
</div>
<!-- <button type="submit" onclick="repasa(vMarkers)">Ok</button> -->
<button type="submit">Ok</button>
</form>
 
<script>
var vMarkers = new Array();
 
function geoloc(marks, index){
	objeto = document.getElementById('direccion'+index);
	if (!(olat=document.getElementById('latitud'+index)) ) alert("latitud"+index+" not found!");
	if (!(olng=document.getElementById('longitud'+index))) alert("longitud"+index+" not found!");
	GMaps.geocode({
		address: objeto.value.trim(),
		callback: function(results, status){
			if(status=='OK'){
				latitud  = parseFloat(results[0].geometry.location.lat());
				longitud = parseFloat(results[0].geometry.location.lng());
				marks[index] = [latitud, longitud, objeto.value.trim()];
				olat.value=latitud;
				olng.value=longitud;
			}
		}
	});
}
 
function myFunction(index) {
	field="direccion"+index;
    x=document.getElementById(field);
    x.value = x.value.toUpperCase();
	geoloc(vMarkers,index);
}
 
function repasa(marcas) {
	alert(marcas);
	for(i=0;i++;i<marcas.length()) {
		geoloc(marcas,i);
	}
	alert("Hecho");
}
 
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://localhost/droptimist/js/bootstrap.min.js"></script>
<script src="http://localhost/droptimist/js/ie10-viewport-bug-workaround.js"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclusterer/1.0/src/markerclusterer.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="https://rawgit.com/HPNeo/gmaps/master/gmaps.js"></script>
 
<div class="container col-md-6">
	<div id="map-container">
		<div id="dummy"></div>
		<div id="gmap"></div>
	</div>
</div>
 
</body>
</html>

La función repasa finalmente no la he llegado a usar, así que se puede quitar.

¿Alguna mejora, error, sugerencia?

¡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