JavaScript 单击侦听器并单击事件委托功能，独立于库

Posted 2021-05-20

/*! 
light-weight click listener, v 1.0
Copyright (c) 2010 by madr <http://madr.se>
Licensed under the MIT license: http://en.wikipedia.org/wiki/MIT_License
*/
/*
Usage:
Alter the below snippet for your needs and put the modified snippet in a js-file or a <script> and add it to your document. If your webapp depends on libraries or other resources to load, you better keep that in mind.
*/
(function(document, undefined) {
    function investigate(elm){
        /*
        Change the content of this function
        to suit your web application.
        */

        /*
        EXAMPLE 0: do nothing until jQuery (or other libraries) is loaded.
        if (typeof window.jQuery == 'undefined') { return false; }
        */
        
        /*
        EXAMPLE 1: look for element type
        if (elm.nodeName == 'A') {
            // do stuff ...
            return true;
        }
        */
        
        /*
        EXAMPLE 2: look for id or other property
        if (elm.id == 'modal-window-opener') {
            // do stuff ...
            return true;
        }
        */
        
        /*
        EXAMPLE 3: sniffing a classname
        if (elm.className.match(/read-more/)) {
            // do stuff ...
            return true;
        }
        */    
        
        return false; // default
    }
    
    function clicklistener(evt){
        var event = evt || window.event,
            elm = event.target || window.srcElement,
            magic_did_happen = investigate(elm);
        
        if (magic_did_happen) {
            if (window.event) { window.eventReturnValue = false; } 
            else { evt.preventDefault(); }

            return false;
        }
    }
    
    if (document.attachEvent) { 
        document.attachEvent('onclick', clicklistener); 
    } else {
        document.addEventListener('click', clicklistener, false); 
    }
})(document);