Welcome to Idea R | Branding - Web Agency - Digital Strategies
Switch to the mobile layout

      Idea R - Do you have a real web strategy? Persuasion Technologies

Blog

Take a software geek from the 80s, add a new generation graphic designer and dilute with a longtime marketing strategist. Shake vigorously and you'll get the Idea R's blog.

Change language... italiano

jQuery: come lanciare e gestire gli eventi personalizzati

Published on 11/22/2012
Categories: Web Design
jQuery: come lanciare e gestire gli eventi personalizzati

This article is available in English too.

Avevamo già visto in un articolo precedente come gestire gli eventi JavaScript.
jQuery semplifica ma soprattutto uniforma il motore di eventi di JavaScript con 2 semplici metodi: bind() per sottoscriversi ad un evento e trigger() per lanciarlo.

Gli eventi non sono però solo una prerogativa degli oggetti standard DOM (Document Object Model), anche i vostri oggetti possono lanciare eventi, persino se non hanno nulla a che fare con il DOM.
In linea generale con jQuery ci si sottoscrive agli eventi usando le seguente forma

$(mySelector).bind('click', function(event){...});

o la forma più contratta

$(mySelector).click(function(event){...});

Come anticipato ci si può sottoscrivere anche ad eventi personalizzati, con

$(mySelector).bind('mycustomevent', function(event){...});

che a loro volta verranno lanciati dall'oggetto personalizzato con

$(mySelector).trigger('mycustomevent');

Domanda: se volessi passare delle informazioni all'event handler al momento del binding?
Risposta: si può passare qualsiasi informazione specificandola nell'istruzione bind che poi l'event handler recupererà dalla proprietà data dell'oggetto event.

// Use myCustomData to hold bind-time data
$(mySelector).bind('mycustomevent', myCustomData, function(event)
{
    ...

    // event.data contains myCustomData
    var myData = event.data;

    ...
});

Altra domanda: e se volessi passare delle informazioni all'event handler al momento del lancio dell'evento?
Risposta: si definisce semplicemente un parametro aggiuntivo nell'event handler.

// Use myParam to hold trigger-time data
$(mySelector).bind('mycustomevent', function(event, myParam){...});
...
$(mySelector).trigger('mycustomevent', 'this is the trigger-time parameter');

You are the reader number 7,003.

Comments

Previous article

Previous article

An App to see Amsterdam through Anne Frank's eyes

Next article

3 methods to detect mobile devices in ASP.NET

Next article

Scroll to top