0

No se la razón de por que me ejecuta dos veces el click. Entendía que cuando le ponias el off ya no lo hacía mas. Al hacerlo dos veces, ejecuta las funciones dos veces.

$(document).ready(function(){

<?php if (isset($_GET['org'])){  ?>
    org=<?php echo $_GET['org'];}?>;
    
    if(org==1){
        ticador=532; //Presencia
    }
    else if(org==2){
        ticador=531; //Descanso
    }
    
    estadoInicio(org,1); //Volvemos a comprobar el estado del ticaje para colocar el botón como corresponda.
    

$('#boton').off( "click");
$('#boton').on( "click", function() {
        
        creaTicaje(ticador);
        estadoInicio(org,1); //Aqui se si estoy dentro de presencia o producción
        countdown(30);
});

});

El botón es un div que lo he llamado asi, añado código de boton

<body class="m-0 vh-100 row justify-content-center align-items-center  ">
<div class="col-auto p-5 text-center boton    " >
    <div class="switch-button   cursor-pointer    " id="boton">
        <!-- Checkbox -->
        <input type="checkbox" name="switch-button" id="switch-label" class="switch-button__checkbox ">
        <!-- Botón -->
        <label for="switch-label" class="switch-button__label cursor-pointer "></label>
    </div>
    <div id="tiempo"   class="h1 text-success" style="display: none;"></div>
    <div id="countdown"   class="h2 text-success"></div>
    </div>
1
  • puedes poner el html de tu boton? para descartar que sea de tipo "submit"
    – MrDonPh0x
    Commented el 13 jun. 2023 a las 21:36

1 respuesta 1

0

Si lo que quieres es quitar el listener una vez se haya presionado el botón, entonces coloca el off dentro de la función de escucha.

Si no es eso, entonces quita el off, tampoco entiendo qué sentido tiene usarlo aquí. Si el listener se llama más de una vez debes revisar qué ocurre en las funciones.

Aquí un código limpio donde el alert se muestra una vez, cada vez que se presiona el botón:

$(document).ready(function() {
  //...

  $('#boton').on("click", function() {
    alert('Se mostrará sólo una vez x cada  click');
    //$('#boton').off("click");
    //...

  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body class="m-0 vh-100 row justify-content-center align-items-center  ">
  <div class="col-auto p-5 text-center boton    ">
    <div class="switch-button   cursor-pointer    " id="boton">
      <!-- Checkbox -->
      <input type="checkbox" name="switch-button" id="switch-label" class="switch-button__checkbox ">
      <!-- Botón -->
      <label for="switch-label" class="switch-button__label cursor-pointer "></label>
    </div>
    <div id="tiempo" class="h1 text-success" style="display: none;"></div>
    <div id="countdown" class="h2 text-success"></div>
  </div>
</body>

Te recuerdo que $(document).ready(function() { es obsoleto desde jQuery 3, considera usar $(function() { en su lugar:

$(function() {

  //...

  $('#boton').on("click", function() {
    alert('Se mostrará sólo una vez x cada click');
    //$('#boton').off("click");
    //...

  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body class="m-0 vh-100 row justify-content-center align-items-center  ">
  <div class="col-auto p-5 text-center boton    ">
    <div class="switch-button   cursor-pointer    " id="boton">
      <!-- Checkbox -->
      <input type="checkbox" name="switch-button" id="switch-label" class="switch-button__checkbox ">
      <!-- Botón -->
      <label for="switch-label" class="switch-button__label cursor-pointer "></label>
    </div>
    <div id="tiempo" class="h1 text-success" style="display: none;"></div>
    <div id="countdown" class="h2 text-success"></div>
  </div>
</body>

6
  • Muchas gracias por contestar. Lo que quiero es que al darle una vez al botón, no me ejecute las funciones dos veces. Pero necesito que el botón funcione siempre que le pulse. De esta forma que me indica solo le puede dar una sola vez y ya no funciona mas. Commented el 13 jun. 2023 a las 22:20
  • @LorenzoMartín pues revisa las funciones, el problema debe estar allí. Si quitamos el off de dentro verás que el código no se ejecuta nunca dos veces, si eso ocurre es porque hay algún problema en las funciones. Revisa y si no logras resolverlo agrega el código de las funciones para revisar. Ahora edito los snippet para que veas que el alert se muestra sólo una vez.
    – A. Cedano
    Commented el 13 jun. 2023 a las 22:24
  • Debe de ser otra cosa... si yo pongo una función que me haga una alert... también me lo hace dos veces. Al llamar a la función, me dispara el aler dos veces Commented el 13 jun. 2023 a las 22:28
  • @LorenzoMartín revisa tu código Javascript, debe haber algo en otra parte que provoca ese comportamiento. Como habrás podido verificar en los snippet, aquí eso no ocurre. Prueba primero a comentar las funciones que tienes dentro poniendo delate de ellas // y si sigue dando el problema entonces revisa las demás partes del código.
    – A. Cedano
    Commented el 13 jun. 2023 a las 22:31
  • Me has dado la pista, efectivamente el tema esta en el imput y en el label que están dentro del div botón. Si saco un div fuera si m lo hace bien. Commented el 13 jun. 2023 a las 22:43

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.