Javascript Leaftlet标记侦听器

我真的不明白为什么我不能单独将侦听器添加到标记，而不是在创建标记时添加它。看一下代码，这样你就可以有一个更清晰的想法

这是我的完整脚本：

<script>

    map = L.map('map');

    var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
    var osmAttrib = 'http://openstreetmap.org';
    var osm = new L.TileLayer(osmUrl, { minZoom: 8, maxZoom: 12, attribution: osmAttrib });

    map.setView(new L.LatLng(51.3, 0.7), 9);
    map.addLayer(osm);

    map.panTo(new L.LatLng(21.0285, 105.8542));

    var marker;

    function onMapClick(e) {
        marker = L.marker([e.latlng.lat, e.latlng.lng]).addTo(map).on('click', onMarkerClick);
        var divAnimation = $("div.infoTab");
        divAnimation.animate({ top: '100%' }, "slow");
    }

    map.on('click', onMapClick);

    function onMapDrag(e) {

    }

    function onMarkerClick(e) {
        //marker.bindPopup("I have just clicked this marker.").openPopup();
        var divAnimation = $("div.infoTab");
        divAnimation.animate({top: '30%'}, "slow");
    }

    //marker.on('click', onMarkerClick);
</script>

---

有人能解释为什么会发生这种情况吗？

单击

map

时，您的

标记将被指定。因此，当您在
标记
上注册单击事件时，
标记
为
未定义

function onMarkerClick(e) {
        //marker.bindPopup("I have just clicked this marker.").openPopup();
        var divAnimation = $("div.infoTab");
        divAnimation.animate({top: '30%'}, "slow");
    }

    marker.on('click', onMarkerClick);