如何根据其弹出信息验证被点击的Leaflet Marker是否是我想要的?

How to verify the Leaflet Marker being clicked is the one I want based on its popup information?

在传单中,我的一些标记是这样构建的;

$div1 = "<div class='xx'>OBJ: $objmrkr<br></div><div class='gg'>W3W: $w3w</div>";                          //echo "$div1<br>";   
        $div2 = "<div class='cc'>Comment:<br>$comment</div>";               //echo "$div2<br>";
        $div3 = "<div class='bb'><br>Cross Roads:<br>$cr</div><br><div class='gg'>$row[lat],$row[lng]<br>Grid: $gs<br><br>Captured:<br>$row[timestamp]</div>";  //echo "$div3<br>";
        
        
        $objMarkers .= " var $objmrkr = new L.marker(new L.LatLng($row[lat],$row[lng]),{
                            rotationAngle: $dup, 
                            rotationOrigin: 'bottom', 
                            opacity: 0.75,
                            contextmenu: true, 
                            contextmenuWidth: 140,
                            contextmenuItems: [{ text: 'Click here to add mileage circles',callback: circleKoords}],
                            
                            icon: L.icon({iconUrl: '$markername', iconSize: [32, 34]}),
                            title:`marker_$markNO`}).addTo(fg).bindPopup(`$div1<br>$div2<br>$div3`).openPopup();                    
                            
                            $('Objects'._icon).addClass('objmrkr'); 
                                       
                       ";
        }; 

当右键单击 circleKoords 函数时被调用,但在它的代码是 运行 之前我需要知道我是否有正确的标记。正确的标记在标题中有一个 'OBJ:',如示例所示。这似乎是一种笨拙的方法,但我不知道另一种方法。我的问题是如何验证 'OBJ:' 是否在此标记的弹出窗口中? SO 上有许多类似的问题,但其中 none 似乎有效,我不确定是不是因为我使用的是上下文菜单或其他东西。 我试过了; var imanobj = e.xx 之类的东西,但似乎没有得到我需要的东西? 想法?

您需要获取(标记的)弹出窗口的内容marker.getPopup().getContent(),然后您可以使用content.indexOf("OBJ") > -1检查它是否包含该字符串。

marker.on('contextmenu',(e)=>{
  var marker = e.target;
  if(marker.getPopup()){
    var popup = marker.getPopup();
    if(popup.getContent().indexOf("OBJ") > -1){
        alert('Clicked Marker has OBJ')
    }
  }
})

https://jsfiddle.net/falkedesign/54hoaerx/

设置OBJ标志的其他方法:

如果你想知道标记是否是OBJ-Marker,你可以简单地添加一个属性标志。 $objmrkr.objFlag = true;

$objMarkers .= " var $objmrkr = new L.marker(new L.LatLng($row[lat],$row[lng]),{
                            rotationAngle: $dup, 
                            rotationOrigin: 'bottom', 
                            opacity: 0.75,
                            contextmenu: true, 
                            contextmenuWidth: 140,
                            contextmenuItems: [{ text: 'Click here to add mileage circles',callback: circleKoords}],
                            
                            icon: L.icon({iconUrl: '$markername', iconSize: [32, 34]}),
                            title:`marker_$markNO`}).addTo(fg).bindPopup(`$div1<br>$div2<br>$div3`).openPopup();                    
                            
                            $('Objects'._icon).addClass('objmrkr'); 
                   $objmrkr.objFlag = true;
                       ";
marker.on('contextmenu',(e)=>{
  var marker = e.target;
  if(marker.objFlag){
        alert('Clicked Marker is a OBJ-Marker')
  }
})

监听器在php字符串中的实现:

(我没有检查是否有任何php错误)


$objMarkers .= " var $objmrkr = new L.marker(new L.LatLng($row[lat],$row[lng]),{
        rotationAngle: $dup,
        rotationOrigin: 'bottom',
        opacity: 0.75,
        contextmenu: true,
        contextmenuWidth: 140,
        contextmenuItems: [{ text: 'Click here to add mileage circles',callback: circleKoords}],
        
        icon: L.icon({iconUrl: '$markername', iconSize: [32, 34]}),
        title:`marker_$markNO`}).addTo(fg).bindPopup(`$div1<br>$div2<br>$div3`).openPopup();

        $('Objects'._icon).addClass('objmrkr');

        $objmrkr.on('contextmenu',function(e){
            var marker = e.target;
            if(marker.getPopup()){
                var popup = marker.getPopup();
                if(popup.getContent().indexOf('OBJ') > -1){
                    alert('Clicked Marker has OBJ')
                }
            }
        })";