3

我正在使用Dragula在我正在使用的应用程序中拖放项目。动态添加的可拖动项目在任何地方都可以使用,除了在Leaflet地图弹出窗口中,我不知道为什么。

这是我想要工作的一个小例子;我的弹出窗口会引入动态内容,并且弹出窗口中的项目将能够被拖到地图之外的某个地方。

var drake = dragula([$(".misc").get(0)]),
    map = L.map('map').setView([36.305165, 137.944336], 6);

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(map);
L.Icon.Default.imagePath = 'http://api.tiles.mapbox.com/mapbox.js/v1.0.0beta0.0/images';

map.on("click", function(e) {
    map.closePopup();
    var content = '<h3>Items</h3><div class="map__items" id="mapitems"><div class="map__items_item">Item 1</div><div class="map__items_item">Item 2</div></div>';
    var popup = L.popup()
        .setLatLng(e.latlng)
        .setContent(content)
        .openOn(map);
  drake.containers.push($('#mapitems').get(0));
});

http://jsfiddle.net/d2pkmfcj/

如何从弹出窗口中获取“项目 1”和“项目 2”进行拖动?

编辑:更新了小提琴以演示 Dragula 实例的功能。您可以将项目拖入弹出窗口,但不能拖出。这似乎与 Leaflet 限制 DOM 事件有关。

4

0 回答 0