https://github.com/zenorocha/delegate

Lightweight event delegation
https://github.com/zenorocha/delegate

Last synced: about 2 months ago
JSON representation

Lightweight event delegation

• Host: GitHub
• URL: https://github.com/zenorocha/delegate
• Owner: zenorocha
• Created: 2015-10-25T23:00:29.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2022-12-06T18:19:22.000Z (over 1 year ago)
• Last Synced: 2024-04-14T05:17:50.645Z (2 months ago)
• Language: JavaScript
• Homepage: http://npmjs.com/delegate
• Size: 190 KB
• Stars: 183
• Watchers: 5
• Forks: 30
• Open Issues: 12
• Metadata Files:
  • Readme: readme.md

Lists

• awesome-micro-npm-packages - delegate - Lightweight event delegation. (Modules / Browser)
• awesome-stars - zenorocha/delegate - Lightweight event delegation (JavaScript)
• awesome-stars - delegate - Lightweight event delegation (JavaScript)
• awesome-micro-npm-packages - delegate - Lightweight event delegation. (Modules / Browser)

README

        
# delegate

Lightweight event delegation.

## Install

You can get it on npm.

```

npm install delegate --save

```

If you're not into package management, just [download a ZIP](https://github.com/zenorocha/delegate/archive/master.zip) file.

## Setup

###### Node (Browserify)

```js

var delegate = require('delegate');

```

###### Browser (Standalone)

```html

```

## Usage

### Add event delegation

#### With the default base (`document`)

```js

delegate('.btn', 'click', function(e) {

    console.log(e.delegateTarget);

}, false);

```

#### With an element as base

```js

delegate(document.body, '.btn', 'click', function(e) {

    console.log(e.delegateTarget);

}, false);

```

#### With a selector (of existing elements) as base

```js

delegate('.container', '.btn', 'click', function(e) {

    console.log(e.delegateTarget);

}, false);

```

#### With an array/array-like of elements as base

```js

delegate(document.querySelectorAll('.container'), '.btn', 'click', function(e) {

    console.log(e.delegateTarget);

}, false);

```

### Remove event delegation

#### With a single base element (default or specified)

```js

var delegation = delegate(document.body, '.btn', 'click', function(e) {

    console.log(e.delegateTarget);

}, false);

delegation.destroy();

```

#### With multiple elements (via selector or array)

Note: selectors are always treated as multiple elements, even if one or none are matched. `delegate()` will return an array.

```js

var delegations = delegate('.container', '.btn', 'click', function(e) {

    console.log(e.delegateTarget);

}, false);

delegations.forEach(function (delegation) {

    delegation.destroy();

});

```

## Browser Support

|  |  |  |  |  |  |

|:---:|:---:|:---:|:---:|:---:|:---:|

| Latest ✔ | Latest ✔ | Latest ✔ | 9+ ✔ | Latest ✔ | Latest ✔ |

## License

[MIT License](http://zenorocha.mit-license.org/) © Zeno Rocha