无法使用传单移除与每个复选框关联的图层

Question

我有一个问题，我正在尝试解决它的正弦，因此我有一个从Postgres数据库中检索的数据列表，此列表的每个项目都与复选框相关，因此，当我单击给药的复选框时，相应的图层将使用当然的传单在地图上显示。我的目的是动态创建此层，以便在取消选中给定的复选框时删除每一层。当我单击每个复选框时，我可以从数据库中检索其关联元素的坐标到地图显示，但是当我选中给定的复选框时，它总是删除最后一层，而不是此复选框的通讯层。我希望我很清楚。任何帮助都将受到赞赏。您将在下面找到我的代码：

php文件的摘要：

while ($row = pg_fetch_array($result)) 
              {
                  echo '<div id="' . $row['nom'] . '" class="col-sm-10"><li class="Liste">' . $row['nom'] . '</li>       
                  <div class="checkbox chk">
                  <label><input type="checkbox" name="id" id="DisplayCheckbox" value="' . $row['nom'] . '"></label>
                  </div>';
                  $variable=$row2['nom'];
                  if($result)
              {
                  $query2 = "SELECT st_asgeojson(st_transform(geom,4326)) from domaine where nom='$variable'"; 
                  $result2 = pg_query($query2); 
                  while ($row2 = pg_fetch_array($result2)) 
                  {
                      echo '<li class="Liste" name="id" style="display:none;">' . $row2[0]. '</li></div><br/>';
                 
                  }
                  
              }
              }
              echo '</ul>'         
      }   
?>
<script type="text/javascript">
$(document).ready(function(){
$('input[id^="DisplayCheckbox"]').on('click',function() 
{
    parent = $(this).val();
    Item = $(this).parents('#' + parent).find("li.Liste").text();
    
          
            if($(this).is(":checked"))
             $.drawCategory(geoItem);
            else
             
             $.removeItem(CategoryItem);
        
});
});
</script> 

外部jQuery文件：

$.drawCategory = function(data)
 {
      dataCategory = $.parseJSON(data);
              
              var geojsonFeature = 
              {
                      "type": "FeatureCollection",
                        "features": [{
                        "type": "Feature",
                        "geometry": {
                                  "type": dataCategory.type,
                                  "coordinates": dataCategory.coordinates
                              }
                      }]
              };
              Item=L.geoJson(geojsonFeature).addTo(map);
              map.fitBounds(Item.getBounds());
 };
 $.removeItem = function()
 {      
      
        map.removeLayer(Item);
        
        
 };

Answer 1

它总是删除最后一层，而不是该复选框的相应层。

这很可能是因为您的代码仅使用一个引用该图层的参考，并且该引用在您期望的位置之外的可变范围中。

另外，代码是不干净的，例如功能调用就像：

$.removeItem(CategoryItem);

，但是CategoryItem在该范围上不可用，此外，该功能的定义不采用任何参数：

$.removeItem = function()

清洁您的代码和文档（以代码注释的形式）您功能的输入，效果和输出。潜在的问题是您无法控制自己的代码。