Gọi hàm chỉ khi

Question

Tôi có 3 div (#Mask #Intro #Container) vì vậy nếu bạn nhấp vào Mặt nạ, Giới thiệu sẽ bị ẩn và Vùng chứa sẽ xuất hiện. Vấn đề là tôi chỉ muốn tải một lần duy nhất, không phải mỗi lần tôi làm mới trang hoặc bất cứ khi nào tôi nhấp vào menu hoặc liên kết, v.v.

Làm cách nào để thực hiện việc này?

Đây là kịch bản tôi đang sử dụng cho bây giờ:

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

Cảm ơn bạn!

Answer 1

Bạn có thể thử sử dụng bộ đếm đơn giản.

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

Để tồn bạn này sẽ cần phải set a cookie. (ví dụ: $.cookie() nếu bạn sử dụng 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); 
     } 
    }); 
}); 

Để xóa cookie sau:

$.cookie('eventsFired', null); 

Answer 2

trang web là stateless ở chỗ chúng không giữ trạng thái giữa làm mới trang. Khi bạn tải lại trang, nó không có đầu mối gì đã xảy ra trong quá khứ.

Cookie để giải cứu! Bạn có thể use Javascript (và jQuery has some nice plugins để làm cho nó dễ dàng hơn) để lưu trữ các biến trên trình duyệt của khách hàng. Lưu trữ cookie khi mặt nạ được nhấp vào, để khi trang được tải tiếp theo, cookie sẽ không bao giờ hiển thị.

Answer 3

mã này với sẽ làm việc hoàn hảo cho bạn và nó là cách tiêu chuẩn được cung cấp bởi jquery để ràng buộc sự kiện mà bạn muốn thực hiện một lần duy nhất

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

Answer 4

Chỉ cần điểm để một chức năng có sản phẩm nào một khi nó đã được gọi.

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