Problema para enviar dos booleanos con ajax y setTimeout()

Tengo dos funciones que cada uno debe enviar 0 o 1 en una página de php con ajax. al pulsar una tecla en el teclado, la función que envía 1 comienza y la que envía 0 debe comenzar tres segundos más tarde con un setTimeout (). El problema es que la segunda función no envía. Te envío la parte del código correspondiente. Gracias de antemano por su ayuda, y por favor perdone mi no muy buen inglés para leer ^^ '

Mi código:

function typing() {
  var typingBool = 1
  if (typingBool != "") {
    let donneee = {}
    donneee["typingBool"] = typingBool
    let donneeeJson = JSON.stringify(donneee)
    let xmlhttp = new XMLHttpRequest()
    xmlhttp.open("POST", "ajax/typing.php")
    xmlhttp.send(donneeeJson)
  }
}

function typing2() {
  var typingBool = 0
  if (typingBool != "") {
    let donneee = {}
    donneee["typingBool"] = typingBool
    let donneeeJson = JSON.stringify(donneee)
    let xmlhttp = new XMLHttpRequest()
    xmlhttp.open("POST", "ajax/typing.php")
    xmlhttp.send(donneeeJson)
  }
}

var typingText = document.getElementById('texte');
typingText.addEventListener('keypress', function() {
  typing();
  setTimeout(function() {
    typing2()
  }, 3000);
})

Pregunta hecha hace 3 años, 4 meses, 28 días - Por csharpsorcerer


3 Respuestas:

  • El problema principal aquí es el diferencia entre != " !==:

    if (0 !=  "") { console.log("Won't be displayed"); }
    if (0 !== "") { console.log("Will be displayed");  }

    Dicho esto, su código podría acortarse un poco, esto debería funcionar:

    function typing(typingBool){
      let donneeeJson = JSON.stringify({ typingBool: typingBool });
      let xmlhttp = new XMLHttpRequest();
         
      xmlhttp.open("POST", "ajax/typing.php");
      xmlhttp.send(donneeeJson);
    }
    
    var typingText = document.getElementById('texte');
    typingText.addEventListener('keypress', function(){
      typing(1);
      setTimeout(function(){ typing(0); }, 3000);
    });
    

    Respondida el Dec 18, 2020 a las 16:35 - por techtrailblazer8d2c

    Votos positivos: 0 | Votos negativos: 0

  • ¡Hola! Parece que el problema está en cómo estás manejando la variable typingBool en las funciones typing() y typing2(). Actualmente, estás asignando un valor numérico a typingBool, pero luego estás comprobando si no es una cadena vacía en el condicional if, lo cual no tiene mucho sentido en este contexto.

    Para solucionar este problema, puedes simplificar tus funciones de la siguiente manera:

    javascript
    function typing(typingBool) {
      let donneee = {
        typingBool: typingBool
      };
      let donneeeJson = JSON.stringify(donneee);
      let xmlhttp = new XMLHttpRequest();
      xmlhttp.open("POST", "ajax/typing.php");
      xmlhttp.send(donneeeJson);
    }
    
    var typingText = document.getElementById('texte');
    typingText.addEventListener('keypress', function() {
      typing(1);
      setTimeout(function() {
        typing(0);
      }, 3000);
    });
    

    En este código, la función typing() toma un parámetro typingBool que luego se utiliza para determinar el valor a enviar. Al llamar a la función typing() dentro del evento keypress del elemento typingText, pasamos 1 como argumento la primera vez y 0 después de 3 segundos. De esta forma, se envían correctamente los valores 1 y 0 a través de AJAX.

    Espero que esta solución te sea útil. ¡Déjame saber si necesitas más ayuda!

    Respondida el Dec 19, 2020 a las 16:38 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • El problema del código es que la función typing2() se ejecuta tres segundos después de que se presiona una tecla, pero para ese momento, la función typing() ya se ha ejecutado y ha enviado un valor de typingBool = 1 al servidor. El servidor recibe este valor y actualiza el estado de escritura en consecuencia, por lo que cuando se ejecuta typing2() tres segundos después, el servidor no recibe ninguna nueva actualización porque el estado de escritura sigue siendo 1.

    Para resolver este problema, puedes usar una variable global para rastrear el estado de escritura actual y actualizarla dependiendo de la tecla que se presione. Aquí tienes el código actualizado:

    javascript
    var typingBool = 0;
    
    function typing() {
      typingBool = 1;
      let donneee = {};
      donneee["typingBool"] = typingBool;
      let donneeeJson = JSON.stringify(donneee);
      let xmlhttp = new XMLHttpRequest();
      xmlhttp.open("POST", "ajax/typing.php");
      xmlhttp.send(donneeeJson);
    }
    
    function typing2() {
      typingBool = 0;
      let donneee = {};
      donneee["typingBool"] = typingBool;
      let donneeeJson = JSON.stringify(donneee);
      let xmlhttp = new XMLHttpRequest();
      xmlhttp.open("POST", "ajax/typing.php");
      xmlhttp.send(donneeeJson);
    }
    
    var typingText = document.getElementById('texte');
    typingText.addEventListener('keypress', function() {
      typing();
      setTimeout(function() {
        typing2();
      }, 3000);
    });
    

    En este código, la variable typingBool se comparte entre las dos funciones y se actualiza según la tecla que se presione. Cuando se presiona una tecla, la función typing() establece typingBool en 1 y envía este valor al servidor. Tres segundos después, la función typing2() establece typingBool en 0 y envía este valor al servidor, actualizando con precisión el estado de escritura en el servidor.

    Respondida el Dec 19, 2020 a las 16:42 - por Gemini

    Votos positivos: 0 | Votos negativos: 0