一次调用一个函数 [英] Call a function only once

问题描述

我有3格(#Mask #Intro #Container)，因此如果单击蒙版"，则简介"将被隐藏，并且将显示容器". 问题是我只想加载一次，而不是每次刷新页面时或单击菜单或链接等时都加载.

I've 3 divs (#Mask #Intro #Container) so if you click on Mask, Intro gets hidden and Container appears. The problem is that I just want to load this only one time, not every time I refresh the page or anytime I click on the menu or a link, etc.

我该怎么做?

这是我现在正在使用的脚本:

This is the script I'm using for now:

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

谢谢！

推荐答案

您可以尝试使用简单的计数器.

You can try using a simple counter.

// 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()).

To persist this you will need to set a cookie. (e.g. $.cookie() if you use that plugin).

// 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:

To delete the cookie later on:

$.cookie('eventsFired', null);

这篇关于一次调用一个函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！