Javascript 在'；单击'；先开火后点击_Javascript_Html_Leaflet

Javascript 在'；单击'；先开火后点击

javascript html leaflet

Javascript 在'；单击'；先开火后点击,javascript,html,leaflet,Javascript,Html,Leaflet,为什么在我没有单击传单层时，这个控制台会打印？在阅读本文时，当我单击点图层时，onClick函数将激发并记录到控制台。但是控制台会在页面刷新时记录日志。billboardLayer和Banner Layer都是JS对象 html: 美国每个县的平均租金 JS: var js_文件={ 广告牌管理员：{ 资料来源：布告牌位置，颜色：“#1f78b4” }, 横幅层：{ 资料来源：横幅位置，颜色：“#ff2700” } }; var geojsonLayers={}；用于（js_文件中的

为什么在我没有单击传单层时，这个控制台会打印？在阅读本文时，当我单击点图层时，

onClick

函数将激发并记录到控制台。但是控制台会在页面刷新时记录日志。billboardLayer和Banner Layer都是JS对象

html:


美国每个县的平均租金

JS:

var js_文件={
广告牌管理员：{
资料来源：布告牌位置，
颜色：“#1f78b4”
},
横幅层：{
资料来源：横幅位置，
颜色：“#ff2700”
}
};
var geojsonLayers={}；
用于（js_文件中的文件）{
//console.log（js_文件[file].source）
//console.log（js_文件[file].color）
geojsonLayers[file]=L.geoJson（js_files[file]）。源{
pointToLayer：功能（特性、latlng）{
在（'click'，onClick'上返回L.circleMarker（latlng）/；
},
风格：功能（特征）{
返回{
fillColor:js_files[file].color，
重量:0,，
填充不透明度：0.75，
半径：10
}
},
onEachFeature：功能（功能，图层）{
var images=layer.feature.properties.imageFile；
//控制台日志（图像）；
在（'click'，onClick（图像））；
}
}).addTo（地图）；
}
函数onClick（图像）{
控制台日志（图像）；
//var x=document.getElementById（'imageTest'）；
//x、 innerHTML=''；
//console.log（x）
//
//""
};

通过调用

onClick（images）

您正在调用该函数。你只需要传递一个推荐人。例如，

onClick.bind（这个，图像）

所以它应该是

layer.on（'click'，onClick.bind（这个，图像））
由于它只是您将要传递的引用，因此在执行click处理程序的回调之前不会调用它，也就是说，当您通过调用onClick（images）
来单击时，您正在调用该函数。你只需要传递一个推荐人。例如，onClick.bind（这个，图像）
所以它应该是layer.on（'click'，onClick.bind（这个，图像））
由于它只是您将要传递的引用，因此在执行click处理程序的回调之前（即，由于您正在执行函数而单击时），不会调用它。。。。您没有将其分配给clicklayer。在（'click'，onClick（images）），应该执行，对吗？因为您正在执行函数。。。。您没有将其分配给clicklayer。在（'click'，onClick（images））上应该执行的，对吗？这不起作用，抱歉。我也不完全明白你指的是什么。那没用，对不起。我也不完全明白你指的是什么。
<body>

  <div id='map'></div>
  <div id='footer'>
    <div><img src="\data\images\SC811new2.png" class="footer-img">
        <h1>Average Rent in Every US County</h1>
    </div>
    <p id='imageTest'></p>
</div>

var js_files = {
      billboardLayer: {
        source: billboardLocations,
        color: '#1f78b4'
      },
      bannerLayer: {
        source: bannerLocations,
        color: '#ff2700'
      }
    };
    var geojsonLayers = {};
    for (file in js_files) {
      //console.log(js_files[file].source)
      //console.log(js_files[file].color)
      geojsonLayers[file] = L.geoJson(js_files[file].source, {
        pointToLayer: function(feature, latlng) {
          return L.circleMarker(latlng)//.on('click', onClick);
        },
        style: function (feature) {
          return {
            fillColor: js_files[file].color,
            weight: 0,
            fillOpacity: 0.75,
            radius: 10
          }
        },
         onEachFeature: function(feature, layer) {
           var images = layer.feature.properties.imageFile;
           //console.log(images);
           layer.on('click', onClick(images));
         }
      }).addTo(map);
    }
function onClick(images) {
        console.log(images);
        //var x = document.getElementById('imageTest');
        //x.innerHTML = '<img src="data/images/LCWASD -Lancaster 2.jpg"/>';
        //console.log(x)
        //<img src="\data\images\LCWASD -Lancaster.jpg" id="imageTest">
        //"<img src='something' onmouseover='change(\"ex1\")' />"
      };
  </script>

</body>