How can I create a “first-load” event in html or Javascript?

前端 未结 5 505
暗喜
暗喜 2021-01-15 15:39

I\'m starter. I have an idea. I want to implement an event like this. Is it possible?



First visit event
         


        
相关标签:
5条回答
  • 2021-01-15 15:48

    You have a couple of options: storing a cookie on the client or utilizing the local storage of html5. Either of these could be checked on page load.

    Here is a link for getting started with HTML5 web storage:

    http://www.w3schools.com/html/html5_webstorage.asp

    0 讨论(0)
  • 2021-01-15 15:49

    Since working with localStorage can be tedious because of operators and function names, to simplify you can use the in operator to check if a key exists:

    window.onload = function () {
            if(!('hasThisRunBefore' in localStorage)) {
                /** Your code here... **/
                localStorage.setItem("hasThisRunBefore", true);
            }
        }
    
    0 讨论(0)
  • 2021-01-15 15:51

    Localstorage is probably the way to go. Here is a bit of info on it: http://diveintohtml5.info/storage.html

    Basically it allows you to store small amounts of data on the user's machine (up to 5mb in most browsers). So all you need to do is set a flag in there letting you know that the user has already visited, and if that flag isn't present on page load, show the message.

    // Run function on load, could also run on dom ready
    window.onload = function() {
        // Check if localStorage is available (IE8+) and make sure that the visited flag is not already set.
        if(typeof window.localStorage !== "undefined" && !localStorage.getItem('visited')) {
             // Set visited flag in local storage
             localStorage.setItem('visited', true);
             // Alert the user
             alert("Hello my friend. This is your first visit.");   
        }
    }
    

    This should work in all browsers where local storage is available. See caniuse.com for reference. http://caniuse.com/#search=localstorage

    0 讨论(0)
  • 2021-01-15 16:03

    you can do it for chrome in following way

    <html>
    <head> 
    <title>First visit event</title>    
    <script> 
    function do_something() {
        if(typeof(localStorage.setVisit)=='undefind' || localStorage.setVisit==''){
            localStorage.setVisit='yes';
            alert("Hello my friend. This is your first visit.");
        }
    } 
    </script>
    
    </head>
    
    <body onload="do_something()"> </body>
    
    0 讨论(0)
  • 2021-01-15 16:07

    Use on load. It will execute when the page loads, and you will see your alert. Good luck with your knowledge.

        <html>
        <head>
        <script>
        function load()
        {
        alert("Page is loaded");
        }
        </script>
        </head>
        <body onload="load()">
        <h1>Hello World!</h1>
        </body>
        </html> 
    

    Edit: You can get more advance and set cookies to see if it's the user's first time, but I'm not sure you're at that level yet, but anyways:

    You could for example set a localStorage property like

    if(!localStorage["alertdisplayed"]) {
        alert("Your text")
        localStorage["alertdisplayed"] = true
    }
    

    Note that localStorage isn't supported by older Browsers.

    An alternative would be setting a Cookie and check against its existence

    If you don't know how to set / get cookies with javascript, i would suggest, reading this article: https://developer.mozilla.org/en-US/docs/Web/API/document.cookie?redirectlocale=en-US&redirectslug=DOM%2Fdocument.cookie

    0 讨论(0)
提交回复
热议问题