Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] [DUDA] No se como llamar a la duda xD

 Estas en el tema de [DUDA] No se como llamar a la duda xD en el foro de Javascript en Foros del Web. Bueno antes de nada, me gustaría saludar ya que es mi primer post este foro me ha ayudado bastante con todas las dudas que he ...
  #1 (permalink)  
Antiguo 23/01/2013, 10:32
 
Fecha de Ingreso: enero-2013
Ubicación: Madrid
Mensajes: 2
Antigüedad: 12 años
Puntos: 0
[DUDA] Ayuda Script para un blog
Bueno antes de nada, me gustaría saludar ya que es mi primer post este foro me ha ayudado bastante con todas las dudas que he tenido hasta ahora de javascript pero desde ayer llevo buscando una solución a mi problema y no la encuentro por ningún lado.

Antes de poner la duda, también quiero indicar que llevo muy poco con javascript, llevare como unas dos semanas, ya que he empezado a darlo en el ciclo formativo que estudio y hemos empezado por lo básico pero yo necesito para dentro de unos días hacer una cosa y para ello con lo poco que hemos dado me he apañado a medias.

Mi problema es el siguiente, quiero crear un script para mi blog, de forma que en la entrada del blog en la que deseo insertar el script mediante una serie de alerts, prompt etc. Pida una clave en tres partes (en el codigo se ve mejor) de forma que si insertas bien las 3 partes de la clave se muestre un texto que de otra forma no se mostraria... Es decir, si aciertas y pasas la prueba a parte de la entrada normal (body) se veria un document.write ("Texto adicional si has pasado la prueba") y a continuación el body.
Lo conseguí pero de forma que se cargue solo automáticamente porque no he dado nada de llamar a funciones o crear botones, esto supone un problema porque si cargas la página principal del blog, salen las entradas mas recientes, todo su codigo, entonces si quieres leer una entrada mas vieja o mas nueva que la que tiene el script, automaticamente se carga el script y te pregunta si quieres intentar hacer la prueba.

Por lo que busque e intente aprender a crear funciones, llamarlas, eventos, crear botones con javascript. Y conseguí que el script cargue si pulsas un boton ¿Cuál es el problema ahora? que el document.write a diferencia que antes, carga en una página "nueva" totalmente en blanco, un codigo limpio con todo lo que le metía perdiendo el formato del blog que sin boton, cargaba.

Es decir sin boton quedaba:

"Esta solo se ve si has acertado la clave"

"Esta parte es del body de la página"

Con el formato del blog y ahora solo queda en:

"Esto solo se ve si has acertado la clave"

Sin formato ni nada.

Aporto los dos códigos, con boton y sin boton, para que se vea la diferencia mas clara, siento que el mensaje quede tan largo pero no he encontrado la opción de [spoiler] para dejar el código oculto y que quede reducido el post.

Nota: La clave viene en los comentarios, la primera parte es 1, la segunda 2 y la tercera 3

Con boton:
Código Javascript: 
Ver original
  1. <html>
  2.     <head> 
  3.         <title>Prueba para blog</title> 
  4.     </head>
  5.     <body>
  6.         <script type="text/javascript" language="JavaScript">
  7.             var clavep1;
  8.             var clavep2;
  9.             var clavep3;
  10.             var insertarclave1;
  11.             var insertarclave2;
  12.             var insertarclave3;
  13.             var boton;
  14.             var confirmar;
  15.             var salir;
  16.             
  17.             //Las claves son 1, 2 y 3//
  18.         
  19.     function script () {    
  20.             
  21.             alert ("Adivina la claves y descubre el texto a parte");
  22.             
  23.             do {
  24.             clavep1 = "1";
  25.             insertarclave1 = prompt ("Introduce clave 1");
  26.             
  27.                 if (insertarclave1 != clavep1){
  28.                 salir = confirm ("Incorrecto... Te rindes?");
  29.                     if (salir == true)  {break;}
  30.                 }
  31.             }
  32.             while (insertarclave1 != clavep1);
  33.             
  34.             if (insertarclave1 == clavep1) {
  35.             alert ("La primera parte es correcta, ahora la segunda");
  36.             do {
  37.             clavep2 = "2";
  38.             insertarclave2 = prompt ("Introduce clave 2");
  39.                 
  40.                 if (insertarclave2 != clavep2){
  41.                 salir = confirm ("Incorrecto... Te rindes?");
  42.                     if (salir == true)  {break;}
  43.                 }
  44.             }
  45.             while (insertarclave2 != clavep2);
  46.                     
  47.             if (insertarclave2 == clavep2) {
  48.             alert ("La segunda parte de la clave es correcta, ahora la tercera");
  49.             do {
  50.             clavep3 = "3";
  51.             insertarclave3 = prompt ("La tercera arte es correcta");
  52.             
  53.                 if (insertarclave3 != clavep3) {
  54.                 salir = confirm ("Incorrecto, ¿Te rindes?");
  55.                     if (salir == true)  {break;}
  56.                 
  57.                 }
  58.             }       
  59.             while (insertarclave3 != clavep3); 
  60.             // Llegados a este punto, consigo que pida las 3 partes de la clave, si no acierta saldrá un mensaje de error con la opción de salir. //
  61.                 
  62.                     if (insertarclave3 == clavep3) {
  63.                     // El contenido de este IF es lo que se empezará a ejecutar si se ha acertado la clave. //
  64.                     alert ("La clave es; " + clavep1 + " " + clavep2 + " " + clavep3);
  65.                     alert ("HAs pasado la prueba!!");
  66.                     document.write ("Como has acertado, puedes leer esto. </br>"); 
  67.                     }
  68.             }
  69.             }
  70.     }       
  71.         
  72.         if (boton.addEventListener) {
  73.         boton.addEventListener('click', script, false);
  74.         } 
  75.         else {
  76.         boton.attachEvent('onclick', script);
  77.         }
  78.     </script>
  79.     
  80.         <form  name="formulario" id="formulario" method="GET">
  81.         <input type="button" name="Boton1" value="Pulsa aqui" OnClick="script(this);"><br><br> </form>
  82.         <h1>Encabezado en body</h1>
  83.  
  84.     </body>
  85. </html>

Sin boton:
Código Javascript: 
Ver original
  1. <html>
  2.     <head> 
  3.         <title>Prueba para blog</title> 
  4.     </head>
  5.     <body>
  6.         <script type="text/javascript" language="JavaScript">
  7.             var clavep1;
  8.             var clavep2;
  9.             var clavep3;
  10.             var insertarclave1;
  11.             var insertarclave2;
  12.             var insertarclave3;
  13.             var boton;
  14.             var confirmar;
  15.             var salir;
  16.             
  17.             //Las claves son 1, 2 y 3//
  18.         
  19.             
  20.             alert ("Adivina la claves y descubre el texto a parte");
  21.             
  22.             do {
  23.             clavep1 = "1";
  24.             insertarclave1 = prompt ("Introduce clave 1");
  25.             
  26.                 if (insertarclave1 != clavep1){
  27.                 salir = confirm ("Incorrecto... Te rindes?");
  28.                     if (salir == true)  {break;}
  29.                 }
  30.             }
  31.             while (insertarclave1 != clavep1);
  32.             
  33.             if (insertarclave1 == clavep1) {
  34.             alert ("La primera parte es correcta, ahora la segunda");
  35.             do {
  36.             clavep2 = "2";
  37.             insertarclave2 = prompt ("Introduce clave 2");
  38.                 
  39.                 if (insertarclave2 != clavep2){
  40.                 salir = confirm ("Incorrecto... Te rindes?");
  41.                     if (salir == true)  {break;}
  42.                 }
  43.             }
  44.             while (insertarclave2 != clavep2);
  45.                     
  46.             if (insertarclave2 == clavep2) {
  47.             alert ("La segunda parte de la clave es correcta, ahora la tercera");
  48.             do {
  49.             clavep3 = "3";
  50.             insertarclave3 = prompt ("La tercera arte es correcta");
  51.             
  52.                 if (insertarclave3 != clavep3) {
  53.                 salir = confirm ("Incorrecto, ¿Te rindes?");
  54.                     if (salir == true)  {break;}
  55.                 
  56.                 }
  57.             }       
  58.             while (insertarclave3 != clavep3); 
  59.             // Llegados a este punto, consigo que pida las 3 partes de la clave, si no acierta saldrá un mensaje de error con la opción de salir. //
  60.                 
  61.                     if (insertarclave3 == clavep3) {
  62.                     // El contenido de este IF es lo que se empezará a ejecutar si se ha acertado la clave. //
  63.                     alert ("La clave es; " + clavep1 + " " + clavep2 + " " + clavep3);
  64.                     alert ("HAs pasado la prueba!!");
  65.                     document.write ("Como has acertado, puedes leer esto. </br>"); 
  66.                     }
  67.             }
  68.             }
  69.         
  70.     </script>
  71.         <h1>Encabezado en body</h2>
  72.  
  73.     </body>
  74. </html>

P.D: No pido ayuda, de momento a mi profesor porque creo que me mandaría a... a hacer puñetas (no se si esta permitido decir palabras malsonantes xD) porque siempre me he complicado bastante en su asignatura intentando hacer cosas mas complejas de las que hemos dado xDD
Última edición por Lynnkk; 23/01/2013 a las 10:33 Razón: Cambiar titulo
  #2 (permalink)  
Antiguo 23/01/2013, 12:20
 
Fecha de Ingreso: marzo-2007
Mensajes: 82
Antigüedad: 17 años, 10 meses
Puntos: 21
Respuesta: [DUDA] No se como llamar a la duda xD
Hola, buenas, aver ... mmm, como explicarlo, el document.write() no funciona como crees que funciona ... en tu caso es logico que borre todo y solo aparezca el texto que escribes con document.write() por que lo estas ejecutando una vez que se procesó todo e html ...

En lugar de usar document.write, prueba usar document.innerHTML ... algo asi

Código HTML:
<html>
    <head> 
        <title>Prueba para blog</title> 
    </head>
    <body>
        <script type="text/javascript" language="JavaScript">
            var clavep1;
            var clavep2;
            var clavep3;
            var insertarclave1;
            var insertarclave2;
            var insertarclave3;
            var boton;
            var confirmar;
            var salir;
            
            //Las claves son 1, 2 y 3//
        
    function script () {    
            
            alert ("Adivina la claves y descubre el texto a parte");
            
            do {
            clavep1 = "1";
            insertarclave1 = prompt ("Introduce clave 1");
            
                if (insertarclave1 != clavep1){
                salir = confirm ("Incorrecto... Te rindes?");
                    if (salir == true)  {break;}
                }
            }
            while (insertarclave1 != clavep1);
            
            if (insertarclave1 == clavep1) {
            alert ("La primera parte es correcta, ahora la segunda");
            do {
            clavep2 = "2";
            insertarclave2 = prompt ("Introduce clave 2");
                
                if (insertarclave2 != clavep2){
                salir = confirm ("Incorrecto... Te rindes?");
                    if (salir == true)  {break;}
                }
            }
            while (insertarclave2 != clavep2);
                    
            if (insertarclave2 == clavep2) {
            alert ("La segunda parte de la clave es correcta, ahora la tercera");
            do {
            clavep3 = "3";
            insertarclave3 = prompt ("La tercera arte es correcta");
            
                if (insertarclave3 != clavep3) {
                salir = confirm ("Incorrecto, ¿Te rindes?");
                    if (salir == true)  {break;}
                
                }
            }       
            while (insertarclave3 != clavep3); 
            // Llegados a este punto, consigo que pida las 3 partes de la clave, si no acierta saldrá un mensaje de error con la opción de salir. //
                
                    if (insertarclave3 == clavep3) {
                    // El contenido de este IF es lo que se empezará a ejecutar si se ha acertado la clave. //
                    alert ("La clave es; " + clavep1 + " " + clavep2 + " " + clavep3);
                    alert ("HAs pasado la prueba!!");
                    
                    // document.write ("Como has acertado, puedes leer esto. </br>");
                    document.getElementById("lugar-donde-escribir").innerHTML = "Como has acertado, puedes leer esto. </br>";
                    }
            }
            }
    }       
        
        if (boton.addEventListener) {
        boton.addEventListener('click', script, false);
        } 
        else {
        boton.attachEvent('onclick', script);
        }
    </script>
    
        <form  name="formulario" id="formulario" method="GET">
        <input type="button" name="Boton1" value="Pulsa aqui" OnClick="script(this);"><br><br> </form>
        <h1>Encabezado en body</h1>
 		<div id="lugar-donde-escribir"></div>
    </body>
</html>
__________________
Hazle un favor a tu cerebro y juega Ajedrez online
Chess online
  #3 (permalink)  
Antiguo 23/01/2013, 12:56
 
Fecha de Ingreso: enero-2013
Ubicación: Madrid
Mensajes: 2
Antigüedad: 12 años
Puntos: 0
Respuesta: [DUDA] No se como llamar a la duda xD
Cita:
Iniciado por chinanzio Ver Mensaje
Hola, buenas, aver ... mmm, como explicarlo, el document.write() no funciona como crees que funciona ... en tu caso es logico que borre todo y solo aparezca el texto que escribes con document.write() por que lo estas ejecutando una vez que se procesó todo e html ...

En lugar de usar document.write, prueba usar document.innerHTML ... algo asi

Muchisimas gracias Chinanzio, me funciona perfecto!! Mira que estuve probando con innerHTML pero no era capaz de hacerlo funcionar porque no ponía bien la sitaxis ni sabia que habia que poner un document.get.

Gracias maquina!

Etiquetas: formulario, funcion, html, input
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 02:05.