Llamar a una función solo una vez

Question

Tengo 3 divs (#Mask #Intro #Container) así que si haces clic en Máscara, la introducción se oculta y aparece el Contenedor. El problema es que solo quiero cargar esto una sola vez, no cada vez que actualizo la página o cada vez que hago clic en el menú o un enlace, etc.

¿Cómo puedo hacer esto?

Este es el script que estoy usando por ahora:

$(document).ready(function(){ 
    $("div#mask").click(function() { 
     $("div#intro").fadeToggle('slow'); 
     $("div#container").fadeToggle('slow'); 
     $("div#mask").css("z-index", "-99"); 
    }); 
}); 

Gracias!

Answer 1

Puede probar usando un contador simple.

// count how many times click event is triggered 
var eventsFired = 0; 
$(document).ready(function(){ 
    $("div#mask").click(function() { 
     if (eventsFired == 0) { 
      $("div#intro").fadeToggle('slow'); 
      $("div#container").fadeToggle('slow'); 
      $("div#mask").css("z-index", "-99"); 
      eventsFired++; // <-- now equals 1, won't fire again until reload 
     } 
    }); 
}); 

Para persisten este tendrá que set a cookie. (por ejemplo, $.cookie() si usa ese complemento).

// example using $.cookie plugin 
var eventsFired = ($.cookie('eventsFired') != null) 
    ? $.cookie('eventsFired') 
    : 0; 

$(document).ready(function(){ 
    $("div#mask").click(function() { 
     if (eventsFired == 0) { 
      $("div#intro").fadeToggle('slow'); 
      $("div#container").fadeToggle('slow'); 
      $("div#mask").css("z-index", "-99"); 
      eventsFired++; // <-- now equals 1, won't fire again until reload 
      $.cookie('eventsFired', eventsFired); 
     } 
    }); 
}); 

Para eliminar la cookie más adelante:

$.cookie('eventsFired', null); 

Answer 2

páginas Web son sin estado en el que no se sostienen entre estados actualizaciones de página. Cuando vuelves a cargar la página, no tiene ni idea de lo que sucedió en el pasado.

¡Cookies al rescate! Puede use Javascript (y jQuery has some nice plugins para hacerlo más fácil) almacenar variables en el navegador del cliente. Almacene una cookie cuando haga clic en la máscara, de modo que cuando la próxima página se cargue nunca se muestre.

Answer 3

este código con funcionará perfecto para usted y que es la forma estándar proporcionado por jQuery para enlazar eventos que desea ejecutar sólo una vez

$(document).ready(function(){ 
     $("div#mask").one('click', function() { 
      $("div#intro").fadeToggle('slow'); 
      $("div#container").fadeToggle('slow'); 
      $("div#mask").css("z-index", "-99"); 
     }); 
    }); 

Answer 4

punto justo a una función de vacío una vez que ha sido llamado.

var myFunc = function(){ 
    myFunc = function(){}; // kill it 
    console.log('Done once!'); // your stuff here 
};