插件 jQuery.idletimer 中文API文档

🌙
手机阅读
本文目录结构

插件 jQuery.idletimer 中文API文档 https://github.com/thorst/jquery-idletimer jQuery Idle Timer Plugin

Build Status Dependency Status devDependency Status Coverage Status

Demo

http://thorst.github.io/jquery-idletimer/index.html

Download

Purpose

Fires a custom event when the user is “idle”. Idle is defined by not…

  • moving the mouse
  • scrolling the mouse wheel
  • using the keyboard

Usage

There are two ways to instantiate. Either statically, or on an element. Element bound timers will only watch for events inside of them. You may just want page-level activity, in which case you may set up your timers on document, document.documentElement, and document.body. Instantiate returns jQuery for chaining.

$(function() {
    // binds to document - shorthand
    $.idleTimer();

    // binds to document - explicit
    $( document ).idleTimer();

    // bind to different element
    $( "#myTextArea" ).idleTimer();
});

You can configure the settings several ways

$(function() {
    // idleTimer() with all defaults
    $( document ).idleTimer( );

    // idleTimer() takes an optional numeric argument that defines just the idle timeout
    // timeout is in milliseconds
    $( document ).idleTimer( 10000 );

    // idleTimer() takes an optional object argument that defines any/all setting
    $( document ).idleTimer( {
        timeout:10000, 
        idle:true
    });

    /*
    *   Here are the possible settings
    *   you can omit any or all of them
    */

    // indicates if the user is idle
    idle [default:false] 

    // the timeout period
    timeout [default:30000] 

    // activity is any one of these events
    events [default:'mousemove keydown wheel DOMMouseScroll mousewheel mousedown touchstart touchmove MSPointerDown MSPointerMove']

    // If set, the use a localStorage key to sync activity across browser tabs/windows
    timerSyncId [default:null]
});

When a users state changes a custom events get triggered. There are several parameters passed to your handler for you to use

$(function() {
    $( document ).on( "idle.idleTimer", function(event, elem, obj){
        // function you want to fire when the user goes idle
    });

    $( document ).on( "active.idleTimer", function(event, elem, obj, triggerevent){
        // function you want to fire when the user becomes active again
    });

    /*
    *   Here are the arguments
    */
    // event
    // will be either idle.idleTimer or active.idleTimer
    // use event.stopPropagation(); to stop element from bubbling up to document

    // elem
    // is the element that the event was triggered on

    // obj
    // is a copy of the internal data used by idleTimer

    // triggerevent
    // is the initial event that triggered the element to become active
    // obviously for idle state this will be undefined
});

There are several methods to invoke

$(function() {
    // stop the timer, removes data, removes event bindings
    // to come back from this you will need to instantiate again
    // returns: jQuery
    $( document ).idleTimer("destroy");

    // save remaining time, and stops the timer
    // returns: jQuery
    $( document ).idleTimer("pause");

    // starts timer with remaining time
    // returns: jQuery
    $( document ).idleTimer("resume");

    // restore initial idle state, and restart the timer
    // returns: jQuery
    $( document ).idleTimer("reset");

    // get time left until idle, if idle return 0
    // returns: number
    $( document ).idleTimer("getRemainingTime");

    // get time elapsed (in ms) since the user went idle/active
    // if idle, how have you been idle, if active, how long have you been active
    // returns: number
    $( document ).idleTimer("getElapsedTime");

    // get time last active event fired
    // returns: number
    $( document ).idleTimer("getLastActiveTime");

    // you can also query if it's "idle" or "active"
    // returns: bool
    $( document ).idleTimer("isIdle");
});

Pre-Req

jQuery 1.7 (tested with 1.11.0)

Intended Browser Support

####Desktop

  • =IE8

  • Firefox n-1
  • Chrome n-1
  • Safari n

####Mobile

  • iOS n-1
  • Android (version?)
  • Windows Phone IEMobile/10.0

Playground

Version History

Version Author Released Links
1.0.0 Todd Horst 03/10/2014 Change Log - Breaking Changes
0.9.3 Mike Sherov 08/04/2013

Author History

Bug?

Please create a fiddle and submit a ticket


AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

目前重心已经放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>