Git Product home page Git Product logo

livequery's Introduction

Live Query

Live Query utilizes the power of jQuery selectors by firing callbacks for matched elements auto-magically, even after the page has been loaded and the DOM updated.

Live Query fires a function (callback) when it matches a new element and another function (callback) for when an element is no longer matched. This provides ultimate flexibility and untold use-cases. For example the following code uses a function based Live Query to implement the jQuery hover helper method and remove it when the element is no longer matched.

$('li') 
    .livequery(function(){ 
    // use the helper function hover to bind a mouseover and mouseout event 
        $(this) 
            .hover(function() { 
                $(this).addClass('hover'); 
            }, function() { 
                $(this).removeClass('hover'); 
            }); 
    }, function() { 
        // unbind the mouseover and mouseout events 
        $(this) 
            .unbind('mouseover') 
            .unbind('mouseout'); 
    }); 

API

livequery Signatures

The livequery method has 2 different signatures or ways to call it.

Pass one or two functions to livequery. Doing this, livequery will call the first passed function when an element is newly matched and will call the second passed function when an element is removed or no longer matched. The second function is optional. The this or context of the first function will be the newly matched element. For the second function it will be the element that is no longer matched.

// matchedFn: the function to execute when a new element is matched
$(selector).livequery( matchedFn );

// matchedFn: the function to execute when a new element is matched
// unmatchedFn: the function to execute when an element is no longer matched
$(selector).livequery( matchedFn, unmatchFn );

expire Signatures

The expire method has 3 different signatures or ways to call it.

The first way will stop/expire all live queries associated with the selector.

$(selector).expire();

The second way will stop/expire all live queries associated with the selector and matchedFn.

// matchedFn: the function to execute when a new element is matched
$(selector).expire( matchedFn );

The third way will stop/expire all live queries associated with the selector, matchedFn, and unmatchedFn.

// matchedFn: the function to execute when a new element is matched
// unmatchedFn: the function to execute when an element is no longer matched
$(selector).expire( matchedFn, unmatchFn );

For Plugin Developers

If your plugin modifies the DOM without using the built-in DOM Modification methods (append, addClass, etc), you can register your plugin with Live Query like this.

if (jQuery.livequery) 
    jQuery.livequery.registerPlugin("pluginMethodName"); 

You can register several plugin methods at once by just passing them as additional arguments to the registerPlugin method.

if (jQuery.livequery) 
    jQuery.livequery.registerPlugin("method1", "method2", "method3"); 

License

The Live Query plugin is dual licensed (just like jQuery) under the MIT (MIT_LICENSE.txt) and GPL Version 2 (GPL_LICENSE.txt) licenses.

Copyright (c) 2010 Brandon Aaron (c) 2012 Alexander Zaytsev (c) 2013 Frank Förster

livequery's People

Contributors

brandonaaron avatar frankfoerster avatar hazzik avatar tianon avatar whoahbot avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.