JavaScript 回调函数在运行时不持久化参数？

Question

我在 Android 应用程序的 WebView 中使用 JavaScript 库 Leaflet 来显示带有标记的地图。这些标记代表我的 Android 应用程序中的位置对象，因此通过调用 JavaScript.

中的函数将位置及其 ID 发送到 JavaScript

view.loadUrl("javascript:createLocationMarker(" + lat + "," + lon + "," + locationId + ");");

我不知道这是否真的有必要知道，因为我猜问题似乎出在 JavaScript:

function createLocationMarker(lat, lon, locationId) {
    var marker = L.marker([lat, lon]).addTo(map).on('click', function(locationId) {
        Android.getLocationDetails(locationId);
    });
}

标记是在应该创建的地方创建的。工作正常！问题是绑定到标记的 onClick 回调函数。当用户单击标记时，将调用 JavaScript 中的 Android 接口。这工作正常但不是在创建标记时传输的 locationId，Android.getLocationDetails() 的参数始终为 0。所以我猜 JavaScript 不会保留 locationId。我想那是因为我调试了我的 Android 代码中调用函数 createLocationMarker() 的行，其中 locationId 被定义为正确设置。此外，当我在我的 JavaScript 代码中对 locationId 进行硬编码时，如 Android.getLocationDetails(2);，locationId 2 将直接发送到 Android 中的 JavascriptInterface。所以一定是JavaScript的问题。希望有几个JavaScript高手能帮我这样的菜鸟解决问题

Answer 1

您正在覆盖变量（创建另一个具有相同名称的局部变量）：

function createLocationMarker(lat, lon, locationId) {
    var marker = L.marker([lat, lon]).addTo(map).on('click', function(locationId) {
        Android.getLocationDetails(locationId);
    });
}

使用不同的名称以访问外部范围上的 locationId。

JavaScript 回调函数在运行时不持久化参数？

JavaScript callback function does not persist parameter during runtime?

javascript

callback

android-webview

leaflet