只调用函数一次

Call a function only once

本文关键字：一次 调用 函数      更新时间：2023-09-26

我有3div (#Mask #Intro #Container)，所以如果你点击蒙版，介绍被隐藏，容器出现。问题是，我只想加载这个只一次，而不是每次我刷新页面或每次我点击菜单或链接，等。

我该怎么做?

这是我现在使用的脚本:

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

谢谢!

您可以尝试使用一个简单的计数器。

// 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
        }
    });
});

要保存，你需要设置一个cookie。(例如$.cookie()如果你使用这个插件)。

// 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);
        }
    });
});

稍后删除cookie:

$.cookie('eventsFired', null);

一旦函数被调用，就指向一个空函数。

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

Web页面是无状态的，因为它们在页面刷新之间不保持状态。当你重新加载页面时，它不知道过去发生了什么。

饼干来拯救!您可以使用Javascript (jQuery有一些不错的插件使其更容易)在客户端的浏览器上存储变量。当掩码被点击时存储一个cookie，这样当下次加载页面时它就不会显示了。

这段代码将完美地为你工作，这是jquery提供的标准方式来绑定事件，你想只执行一次

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