How to check if user is active or inactive in webpage Using Javascript or JQuery?

Javascript is great programming language to learn. You can do many funny things with Javascript. In the web browser, you can dynamically change in the HTML dom elements.

In this article, we will go through on how to check if user is active or inactive. For that we will check if is there any browser event inserted like mousemove, click event or scroll event.

There are many usage where user activity is required to check. Mostly this is useful to logout user after inactive or popup modal to confirm user.

Using Javascript

Bellow is the function on how to check user if user is active or inactive using Javascript. On these events trigger, resetTime() function will trigger and time will be cleared. So if none of these event happen, then alertUser() function will be trigger.

You can set any action in alertUser() method, that you want to do.

<script type="text/javascript">
    function inactivityTime() {
        var time;
        
        // events
        window.onload = resetTime;
        window.onclick = resetTime;
        window.onkeypress = resetTime;
        window.ontouchstart = resetTime;
        window.onmousemove = resetTime;
        window.onmousedown = resetTime;
        window.addEventListener('scroll', resetTime, true);

        function alertUser() {
            // do your task here
            alert("User is inactive.");
        }

        function resetTime() {
            clearTimeout(time);
            time = setTimeout(alertUser, 1000 * 10); // 10 seconds
        }

    };

    // run the function
    inactivityTime(); 
</script>

Using JQuery

Same thing you can do with JQuery. Bellow code is how you can do this with JQuery.

<script src="https://code.jquery.com/jquery-3.5.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var inactiveTime;
        $('*').bind('mousemove click mouseup mousedown keydown keypress keyup submit change mouseenter scroll resize dblclick', function () {

            function alertUser() {
                // do your task here
                alert("User is inactive.");
            }
            
            clearTimeout(inactiveTime);

            inactiveTime = setTimeout(alertUser, 1000 * 10); // 10 seconds
        });
        $("body").trigger("mousemove");
    });
</script>

After the defined time, if there is no event trigger, then alertUser() function calls, you can do your task in this function.

I hope you liked this article, share it with your friends. Also follow us on Twitter or like our Facebook page.

Was this article helpful?

0 out of 0 person found this article helpful.

Leave a comment

Or

5 Comment

SA
Thad
November 20, 2020

Hello very cool website!! Guy .. Excellent .. Wonderful ..

I'll bookmark your site and take the feeds additionally?
I'm satisfied to seek out numerous helpful info here
in the post, we want develop more strategies in this regard,
thank you for sharing. . . . . .1590http://rosiesctohj.mee.nu/?entry=3095126http://malakaizdwob1.mee.nu/?entry=3095052

SA
Alethea
November 14, 2020

Everyone loves what you guys tend to be up too.
Such clever work and coverage! Keep up the fantastic
works guys I've added you guys to blogroll.authentic hockey jerseyshttp://careersyou.mee.nu/?entry=3088062http://isabellajn.mee.nu/?entry=3088050

SA
Tina
July 23, 2020

Great blog here! Also your site loads up fast! What web host are you the usage
of? Can I get your associate link for your host?
I desire my site loaded up as quickly as yours lolcheap jerseyshttp://the-superb-blog-7537.294057.n8.nabble.com/centred-Jared-du-Toit-being-competitive-near-home-team-conce-td37.htmlhttp://shalago.blog.wox.cc/entry159.html

SA
온라인카지노
May 20, 2020

Excellent website you have here but I was wanting to know if you knew of any community forums that cover the same topics talked about in this
article? I'd really love to be a part of group
where I can get responses from other experienced individuals that share
the same interest. If you have any suggestions,
please let me know. Appreciate it! https://uricasino114.com

SA
Sandra
May 17, 2020

I will immediately clutch your rss as I can not in finding your e-mail
subscription hyperlink or newsletter service. Do you've
any? Kindly let me know in order that I could subscribe.
Thanks. I seriously love your site.. Pleasant colors
& theme. Did you make this site yourself? Please reply
back as I'm hoping to create my own site and would love to find out where
you got this from or just what the theme is named. Appreciate it!
It's the best time to make a few plans for the long run and it is
time to be happy. I have read this post and if I may just I wish to
recommend you some fascinating things or tips. Maybe you can write next articles referring to this article.
I wish to learn even more things about it! http://alexa.com/