jQuery on() e stopPropagation()

Question

Ho un riquadro laterale che scorre da sinistra, aggiungendo il contenuto dinamicamente con get(). Voglio che tutti i clic all'esterno del riquadro causino la chiusura attivando una funzione. Sulla base di altre domande che ho letto, ho trovato il seguente codice.

$('html').click(function() { 
    if (side_showing) { 
     close_side(); 
    } 
}); 

$(document).on("click", "#side", function(event) { 
    event.stopPropagation(); 
}); 

Non riesco a farlo funzionare. So che è stata attivata la funzione , ma non sembra che sia event.stopPropagation. Qualche consiglio?

Answer 1

Non è possibile utilizzare stopPropagation() con gestione eventi delegata (in cui il gestore eventi è su un padre).

Questo perché è la propagazione di eventi che rende la gestione degli eventi delegata lavoro in primo luogo così al momento in cui il gestore eventi viene chiamato, l'evento si è già propagato.

L'ordine delle cose che accadono nel codice è: propagazione dell'evento fino all'oggetto del documento, quindi il gestore dell'evento viene chiamato. Quindi, quando chiami event.stopPropagation() non fa nulla perché l'evento si è già propagato.

Se è necessario impedire agli oggetti parent di ottenere la propagazione degli eventi, non è possibile utilizzare la gestione degli eventi delegati. Dovrai assegnare direttamente i gestori di eventi agli oggetti stessi in modo da poter intercettare l'evento PRIMA che si propaga. Se questi sono oggetti creati dinamicamente, dovrai assegnare loro i gestori di eventi subito dopo la loro creazione.

L'unica altra soluzione che conosco è mettere i gestori di eventi sugli oggetti padre che non si desidera visualizzare questi eventi e assicurarsi che tali gestori di eventi ignorino gli eventi se provengono dall'oggetto #side.