Jak powiązać obsługę zdarzeń z niestandardowym menu rozwijanym Zurb Foundation Foundation?

Question

Używam frameworka Zurb Foundation i wybieram element, w którym struktura wtryskuje HTML dla niestandardowego elementu select (niestandardowe rozwijanie poniżej).

<select id="caseModule" style="display: none;"> 
    <option value="gifting">Gifting</option> 
    <option value="other">Other</option> 
</select> 
<div class="custom dropdown" style="width: 97px;"> 
    <a href="#" class="current">Other</a> 
    <a href="#" class="selector"></a> 
    <ul style="width: 95px;"> 
    <li>Gifting</li> 
    <li class="selected">Other</li> 
    </ul> 
</div> 

Jak mogę powiązać obsługi zdarzenia jQuery niestandardowego rozwijanej ponieważ jest wstawi on-the-fly podczas wczytywania strony? Jeśli powiązam obsługę zdarzeń .change() z oryginalnym elementem select, nie zostanie ona wywołana. Czy założę, że będzie element div z klasą rozwijaną "custom" zaraz po elemencie select? Wydaje się, że takie podejście może być obarczone potencjalnymi problemami, jeżeli ramy ulegną zmianie.

Answer 1

Oprawa do oryginalnego elementu select-działa perfekcyjnie dla mnie

$(document).ready(function() { 
    $('#caseModule').change(function() { 
     console.log('changed'); 
    }); 
}); 

Answer 2

z Fundacją 5.4.5, jest to praca dla mnie:

$('.dropdown').on('opened.fndtn.dropdown', function() { 
    return console.log('opened'); 
}); 
$('.dropdown').on('closed.fndtn.dropdown', function() { 
    return console.log('closed'); 
});