时间戳

首页 > 解决方案 > 单击或悬停传单标记时如何显示相同的弹出窗口？

javascript - 单击或悬停传单标记时如何显示相同的弹出窗口？

问题描述

我有这样的代码，我想在每个标记中显示'result [key] [16]'，但是悬停弹出窗口总是显示来自json的最后一个数据，与点击的弹出窗口不同，因此可以显示'result [key] [16]'自己的标记数据，我想根据自己的数据制作悬停弹出窗口。我该怎么办？对不起我糟糕的英语。谢谢你

$.ajax({
    url: "test.json",
    dataType: "JSON",
    type: "GET",
    success: function (result) {
        var popup = 'Code : ' + result[key][16];

        L.marker([result[key][1], result[key][2]], {
            icon: ikon
        }).addTo(layertest).on({
            click: showFunction.bind(null, i),
            mouseover: function (e) {
                layerPopup = L.popup({
                        closeButton: false,
                        className: 'hover'
                    })
                    .setLatLng(e.latlng)
                    .setContent(result[key][16])
                    .openOn(map);
            },
            mouseout: function (e) {
                map.closePopup(layerPopup);
            }
        }).bindPopup(popup);
        i=i+1;
    }
})

标签： javascriptleaflet

解决方案

您可以使用与标记连接的弹出窗口的弹出内容bindPopup-> e.target.getPopup().getContent()：

layerPopup = L.popup({
                        closeButton: false,
                        className: 'hover'
                    })
                    .setLatLng(e.latlng)
                    .setContent(e.target.getPopup().getContent())
                    .openOn(map);

https://jsfiddle.net/falkedesign/ktfghvyu/

推荐阅读