Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: RoxyHana en 31 Julio 2013, 12:29 pm



Título: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 12:29 pm
Hola! Resulta que tengo el siguiente código:

Código:
<div id="usercountpost">
<span id="valor"></span></div>

<script type="text/javascript">
window.onload = function (){
var mens=parseInt(document.getElementById('valor').innerText);
var expe=parseInt(mens*1.6);
var nivel=parseInt(expe/2);
}
</script>
<img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/5_zpse406282e.png"/> <script type="text/javascript">document.write(nivel);</script><br/>
<img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/4_zpsaaad303d.png"/> <script type="text/javascript">document.write(expe);</script><br/>

El valor del span se rellena gracias a otro script. El caso es que document.write(nivel); y document.write(expe); no me muestran los valores pero si dentro del script pongo alert(nivel); o alert(expe);, si que me muestra lo que necesito!

Por otra parte necesito convertir esto en un bucle ya que tengo varios <span> con la misma id y necesito que haga lo mismo con todas...

¿Alguna idea? Muchas gracias por adelantado!


Título: Re: javascript document.write falla
Publicado por: EFEX en 31 Julio 2013, 21:00 pm
Declara expe, nivel como variables globales y en vez de utilizar innerText probá con innerHTML.
Para generar el bucle necesitas cambiar el nombre del id, no pueden tener el mismo nombre, algo como..

Código
  1. <span id="valor-1"></span>
  2. <span id="valor-2"></span>
  3. ...
  4.  

Pero eso ya tendras que ver tu script en como lo podes generar. Con una sentencia for obtenes cada valor, haces la operacion y podes generar un nuevo elemento(div) con cada resultado.


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 21:21 pm
No funciona como global tampoco, a lo mejor lo estoy haciendo mal porque acabo de empezar hace poco a estudiar javascript, me resulta más extraño que java...
He probado innerHTML tambien y no funciona...lo extraño me sigue pareciendo que en el alert si funciona, me muestra todo correcto.

El código así tal cual me devuelve expe=1 y nivel=2 en los campos, y en el alert me lo muestra bien, con lo calculado en el script pero si oculto el alert, se me quedan los campos tambien vacíos...las globales dejan de mostrarse.

Código:
                               <div id="usercountpost">
<span id="valor"></span></div>

<script type="text/javascript">
var expe=1;
var nivel=2;
window.onload = function (){
var mens=parseInt(document.getElementById('valor').innerText);
expe=parseInt(mens*1.6);
nivel=parseInt(expe/2);
alert('Mensajes: '+mens+' Exp: '+expe+' Nivel: '+nivel);
}
</script>
<img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/5_zpse406282e.png"/> <script type="text/javascript">document.write(nivel);</script><br/>
<img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/4_zpsaaad303d.png"/> <script type="text/javascript">document.write(expe);</script><br/>


Título: Re: javascript document.write falla
Publicado por: #!drvy en 31 Julio 2013, 22:05 pm
Segun he entendido, lo que te pasa es que no cambian las valores en el document.write pero si cambian en el alert.

Eso te pasa por una sencilla razón:

window.onload = function(), espera a que todo el documento este cargado antes de ejecutarse, mientras que los document.write que pones con las imágenes se ejecutan nada mas se carguen, por tanto, todavía no tienen los valores que se definen dentro de la función.

Yo lo que haría seria esto:
Código
  1. <div id="usercountpost">
  2. <span id="valor">5</span></div>
  3. <script type="text/javascript">
  4. var expe=1;
  5. var nivel=2;
  6. window.onload = function (){
  7.   var mens=parseInt(document.getElementById('valor').innerText);
  8.   expe=parseInt(mens*1.6);
  9.   nivel=parseInt(expe/2);
  10.  
  11.   document.getElementById('cantidad_nivel').innerHTML = nivel;
  12.   document.getElementById('cantidad_exp').innerHTML = expe;
  13.   alert('Mensajes: '+mens+' Exp: '+expe+' Nivel: '+nivel);
  14. }
  15. </script>
  16. <img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/5_zpse406282e.png"/>
  17. <span id="cantidad_nivel"></span><br/>
  18.  
  19.  
  20.  
  21. <img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/4_zpsaaad303d.png"/>
  22. <span id="cantidad_exp"></span><br/>


(http://i.elhacker.net/i?i=JfQn6bqz-dhmLu0Rfxp3X2Vo)

Citar
Por otra parte necesito convertir esto en un bucle ya que tengo varios <span> con la misma id y necesito que haga lo mismo con todas...

HTML esta diseñado SOLO y ÚNICAMENTE para un ID por elemento. Varios ID te arruinan =). Utiliza class y el método getElementsByClassName().

Saludos


Título: Re: javascript document.write falla
Publicado por: EFEX en 31 Julio 2013, 22:08 pm
Si, el maldito onload  ;D, tambien podes crear una funcion y llamarlo...

Código
  1. var expe;
  2. var nivel;
  3. function MostrarNivelExp(){
  4.    var mens=parseInt(document.getElementById('valor').innerHTML);
  5.    expe=parseInt(mens*1.6);
  6.    nivel=parseInt(expe/2);
  7. }
  8.  
  9. MostrarNivelExp();
  10.  


Título: Re: javascript document.write falla
Publicado por: 1mpuls0 en 31 Julio 2013, 22:09 pm
window.onload = function(), espera a que todo el documento este cargado antes de ejecutarse, mientras que los document.write que pones con las imágenes se ejecutan nada mas se carguen, por tanto, todavía no tienen los valores que se definen dentro de la función.

Pero lo más raro es que dice que con una variable si le mostró el resultado xD


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 22:11 pm
Funciona! pero es curioso porque si borro el alert, deja de funcionar, es decir, se quedan los campos vacíos...yo puse el alert solo para comprobar los valores no necesito que me salga. ¿Por qué pasa eso?


Título: Re: javascript document.write falla
Publicado por: #!drvy en 31 Julio 2013, 22:15 pm
Seguro que no borras nada mas que el alert ? Por que si funciona quitandolo ·_·

Saludos


Título: Re: javascript document.write falla
Publicado por: 1mpuls0 en 31 Julio 2013, 22:22 pm
Funciona! pero es curioso porque si borro el alert, deja de funcionar, es decir, se quedan los campos vacíos...yo puse el alert solo para comprobar los valores no necesito que me salga. ¿Por qué pasa eso?


Jajaja algo similar me pasó hace tiempo y la solución que le di fue utilizar jquery  :silbar: para mostrar una imagen de cargando.
Pero el problema es el mismo que comenta  drvy | BSM (como se pronuncia? xD)

Edito.
Aunque revisando bien... no tendría porque pasar en este caso D:

Algo debes tener mal.


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 22:27 pm
Vale, era porque lo ponía en comentario pero al borrarlo si que funciona, mas o menos...me da otros problemas pero intentaré arregarlo por mi cuenta. Si veo que no hay manera volveré por aqui!

Muchas gracias por la ayuda, me sirvió bastante!


Título: Re: javascript document.write falla
Publicado por: EFEX en 31 Julio 2013, 22:29 pm
Jajaja algo similar me pasó hace tiempo y la solución que le di fue utilizar jquery  :silbar: para mostrar una imagen de cargando.

Por que en jquery se utiliza document.ready, espera a que se carge todo el contenido html tambien imagenes.


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 22:36 pm
Ah, lo del bucle que decía al principio...no puedo cambiar el id porque ese span se repite automáticamente, yo no lo controlo... es en un foro y se repite en cada post, por eso necesito que repita esa función cada vez que se encuentre con ese id.
A lo mejor me estoy volviendo loca pero me he empeñado en hacer eso y si no es posible pues tampoco pasa nada, al menos he aprendido algo de javascript!

(Por cierto, en Chrome sólo se actualizan los campos al pulsar F5...si voy de enlace a enlace me muestra NaN. En Firefox no funciona nunca, ni con F5, siempre NaN...)


Título: Re: javascript document.write falla
Publicado por: #!drvy en 31 Julio 2013, 22:54 pm
Bueno, respecto al bucle podrías recorrer todos los elementos y mirar sus ids para ver si coinciden pero ya te digo que va totalmente en contra de la política de los navegadores y el RFC de (X)HTML.

Código
  1. <span id="koko">aaa</span>
  2. <span id="mega">bbb</span>
  3. <span id="koko">ccc</span>
  4. <span id="super">ddd</span>
  5. <span id="koko">eee</span>
  6. <span id="frost">fff</span>
  7.  
  8. <script type="text/javascript">
  9. var cambiar = function(tipo,id,valor){
  10.   // Obtener todos los elementos del tipo. (<span>, <a> etc..)
  11.   var elements = document.getElementsByTagName(tipo);
  12.   // Por cada elemento...
  13.   for(var i=0;i<elements.length;++i){
  14.      // Si tiene la misma id que la indicada, cambiar su valor
  15.      // por el valor indicado
  16.      if(elements[i].id===id){ elements[i].innerHTML = valor; }
  17.   }
  18.   return true;
  19. };
  20.  
  21. // Lamar funcion
  22. cambiar('span','koko','Hola me llamo earl');
  23. </script>
  24.  

Esto cambiaria el contenido de todos los <span> que tengan de id koko por "Hola me llamo earl".

Citar
(Por cierto, en Chrome sólo se actualizan los campos al pulsar F5...si voy de enlace a enlace me muestra NaN. En Firefox no funciona nunca, ni con F5, siempre NaN...)

No entendí -.-. NaN suele salir cuando intentas hacer una operación matemática sobre una variable no definida.

Saludos


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 22:56 pm
Si, se cuando sale NaN pero en Firefox me sale siempre eso, no muestra los valores y en Chrome me sale cuando no pulso F5...y digamos que no voy a tener a los usuarios pulsando F5 cada vez que cambian de página


Título: Re: javascript document.write falla
Publicado por: #!drvy en 31 Julio 2013, 22:59 pm
Pues asegurate de que defines bien las variables. Y ten en cuenta que:

Código
  1. //No es lo mismo esto:
  2. var variable = 'Hola';
  3.  
  4. // Que esto:
  5. variable = 'Hola';

PD: Para ver los posibles errores, en Chrome pulsa F12 y vete a la pestaña "Console/Consola". En firefox es Ctrl + Shift + K.

Saludos


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 23:16 pm
No me sale ningun error relacionado con los scripts. De todas maneras esto es lo que tengo, las variables las tengo como me dijiste

Código:
<div id="usercountpost">
<span id="valor"></span></div>
<script type="text/javascript">
var expe=0;
var nivel=0;
window.onload = function (){
   var mens=parseInt(document.getElementById('valor').innerText);
   expe=parseInt(mens*1.6);
   nivel+=parseInt(expe/2);
 
   document.getElementById('cantidad_nivel').innerHTML = nivel;
   document.getElementById('cantidad_exp').innerHTML = expe;
}
</script>
<img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/5_zpse406282e.png"/>
<span id="cantidad_nivel"></span><br/>

<img src="http://i226.photobucket.com/albums/dd257/RoxyHana/Lyslan_Foro/Iconos/4_zpsaaad303d.png"/>
<span id="cantidad_exp"></span><br/>

En Firefox me muestra NaN siempre...


Título: Re: javascript document.write falla
Publicado por: 1mpuls0 en 31 Julio 2013, 23:37 pm
Por que en jquery se utiliza document.ready, espera a que se carge todo el contenido html tambien imagenes.

También lo intenté.
La verdad es que en ese proyecto sucedieron algunas cosas algo raras xD

No recuerdo muy bien como era, creo que utilizaba timer, pero el contenido que quería no cargaba solo si colocaba colocaba alguna otra función por ejemplo alert y lo que se me ocurrió fue colocar una imagen de loading mientras aparecía el contenido :P


Si, se cuando sale NaN pero en Firefox me sale siempre eso, no muestra los valores y en Chrome me sale cuando no pulso F5...y digamos que no voy a tener a los usuarios pulsando F5 cada vez que cambian de página

A veces cuando se programa sobre todo con js el caché se queda guardado.
Un truco: ctrl+f5
Puede por eso el resultado siempre da lo mismo.

Y después utiliza la consola para ver que error envía.

Saludos.


Título: Re: javascript document.write falla
Publicado por: RoxyHana en 31 Julio 2013, 23:43 pm
En Firefox no me da ningún error de js, solo de css...y en Chrome me dice Failed to load resource