JS funkcja która wykonuje się tylko raz.

Question

var template = document.querySelector('#template');
var popup = document.querySelector('.popup-bg');

template.addEventListener('mouseleave', function(){
  popup.style.display = "block";
}, { once: true });

Witam. Funkcja, która wyświetla popup kiedy kursor myszki opuszcza element. Ma działać na każdej podstronie, ale ma zadziałać tylko raz. Problem w tym, że po wejściu na inna podstronę przeładuje sie i znowu zadziała.

Potrzebuję pomysłu jak dodać funkcje która zadziała raz i się nie przeładuje, lub umieścić element/templatke na całe okno, który nie będzie się przeładowywał po zmianie podstron i w funkcji odwołać sie do niego.

Comments

Nie, właśnie nie ... dlatego Java nie jest językiem skryptowym, nie jest językiem funkcyjnym a obiektowym, a można pisać funkcyjnie.
Tu chodzi o też struktury danych występujące w języku, poczytaj szerzej ...
ja robiłem podyplomowe studia z paradygmatów leksykalnych języków programowania
Jak będziesz chętny podrzucę Ci publikacje
Maszyną Turinga możesz udowodnić słuszność leksykalną języka obiektowego, a np. u JS to nie zachodzi
Myślisz pojęcie przynależności języka z tym, że kod możesz napisać "jako obiektowo" czyli zbudować z elementów obiektowych np stosując klase.

JavaScript NIE MA czegoś takiego jak "KLASA"  to co wystepuje w JS jako Class- to jest PROTOTYP który naśladuje ... np. zachowanie z wykorzystaniem konstruktora i właściowści. 

---

W JavaScript jestem spokojnie w stanie wykorzystać paradygmat obiektowy. Czy to wystarcza żeby nazwać go obiektowym? Moim zdaniem tak.

W zasadzie patrząc stricte na nomenklaturę, JS jest bardziej obiektowy niż Java i C#, które są klasowe ​​​​​

Równie dobrze zaraz może przyjść ktoś od Haskella i opluć js'a bo WCALE NIE JEST FUNKCYJNY.

Z drugiej strony bawi mnie to, że zawsze Javowcy spinają się o takie rzeczy xD

---

No własnie nie nawet w specyfikacji masz napisane, że specjalnie masz "prototypy klasy" a nie same klasy, bo nie jest to język obiektowy. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain

Idąc twoim tokiem myślenia, w każdym języku możesz napisać - według paradygmatu obiektowego, bo nawet jeśli nie masz "swojego kluczowego class" to mozesz zrobić :) samodzielnie typ. A własnie class nie istnieje w JS- jedynie istnieje prototyp

WIęc generalnie nawet idąc według najlepszego źródła i informacji tutaj
http://crockford.com/javascript/javascript.html
jakbyś studiował paradygmaty języków programowania, to rzeczą elementarną i wymaganą do kategoryzacji języka do zbioru jest spełnienie wszystkich warunków, które charakteryzuje podgrupa, a nie  wszystkich za wyjątkiem np 1.

Bo mając  język formalny danego "języka programowania" musimy z niego być wstanie odwzorować wszystkie TAUTOLOGIE dla zbioru należącego do paradygmatu, a tego nie zrobisz skoro nie masz np klasy, a "prototype based classes"

---

Czy to jest problem? Imo nie. Jako developer jestem użytkownikiem interfejsu, który dostarcza język.

A oburzanie się, że tylko Java jest prawilnie obiektowa jest przynajmniej śmieszne i przypomina dyskusje juniorów. Język to język. To, że pod jsowymi klasami latają obiekty linkowane prototypami jest jasne. Pytanie czy to coś zmienia?

---

a ja nie mówię, że tylko jest, ale mówię stanowczo że JS nie jest nic więcej.
C++ jest obiektowy, Perl też jest obiektowy, nawet aktualnie chociaż nie wiem jak biblioteka ale PHP jest obiektowy, spełnia wymagania. Nie wiem też czemu widzisz moje oburzenie, ja się nie oburzam- bo ja tylko tłumacze dlaczego JS nie jest, a nie że "JAVA TYLKO JEST", tylko na jej podstawie pokazałem, żę w javie możesz pisać funkcyjnie [ od wersji 7/8 ] , ale totalnie nie jest językiem funkcyjnym

Jedyny język który znam- w którym tylko CZYSTO OBIEKTOWO można pisać nie da się funkcyjnie, skryptowo,  to Ruby, ale wiem że pewnie jeszcze 1- się znajdzie

Answer 1

Temat rozwiązany w ten sposób, może się komuś przyda w przyszłości. Dziękuję za pomoc :)

var popup = document.querySelector('.popup-bg');

if (!sessionStorage.getItem('popup')) {
  sessionStorage.setItem('popup', 'set');
  
  document.addEventListener('mouseleave', function(){
    popup.style.display = "block";
  });
}

 

Answer 2

Możesz w localstorage przechować state: hasBeenPopupInduced: true / false

Comments

W opisanym przypadku przez OP, IMHO lepsze zastosowanie ma sessionStorage.

LocalStorage vs sessionStorage.

---

Racja