Question

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

php文件的片段：

＆＃13;

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>

＆＃13;

外部jquery文件：

＆＃13;

$.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);
        
        
 };

＆＃13;

Answer 1

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

这很可能是因为您的代码仅使用一个引用来删除图层，并且该引用位于您期望的范围之外的变量范围内。

此外，代码是不洁净的，例如函数调用如：

$.removeItem(CategoryItem);

但是CategoryItem在该范围内不可用，而且该函数的定义不带任何参数：

$.removeItem = function()

清理代码和文档（以代码注释的形式），功能的输入，效果和输出。根本问题在于您无法控制自己的代码所做的事情。

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

1 个答案: