Javascript 传单使用jquery和选择器更改圆半径

使用选择器更改标记的圆半径时出现问题。我试图用jquery on change实现它，但它不起作用。我想让选择器触发jquery函数，获取它的值，然后更改标记的圆半径。
你能告诉我错误在哪里吗

这是选择器：

<div id="map"></div>
<form>
    <select id="distance-selector" name="distance">
        <option value="">Select distance:</option>
        <option value="1">500m</option>
        <option value="2">1km</option>
        <option value="3">5km</option>
        <option value="4">10km</option>
        <option value="5">50km</option>
    </select>
</form>

选择距离：
500米
1公里
5公里
10公里
50公里

下面是我的传单地图的javascript/jquery代码：

$(document).ready(function () {
    var mymap = L.map('map').setView([51.505, -0.09], 13);
    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=xxx', {
        attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
        maxZoom: 18,
        id: 'mapbox.streets',
        accessToken: 'xxx'
    }).addTo(mymap);

    var marker;
    var circle;
    var all;
    mymap.on('click', function (e) {
        if (all) {
            mymap.removeLayer(all);
        }
        marker = new L.Marker(e.latlng, { draggable: true });
        circle = new L.circle(e.latlng, { radius: 500 });
        var circlePos = e.latlng;
        $('distance-selector').on('change', function () {
            if (circle) {
                mymap.removeLayer(circle);
            }
            if (this.value == "") {
                circle = new L.circle(circlePos, { radius: 500 });
            }
            if (this.value == "1") {
                circle = new L.circle(circlePos, { radius: 500 });
            }
            if (this.value == "2") {
                circle = new L.circle(circlePos, { radius: 1000 });
            }
            if (this.value == "3") {
                circle = new L.circle(circlePos, { radius: 5000 });
            }
            if (this.value == "4") {
                circle = new L.circle(circlePos, { radius: 10000 });
            }
            if (this.value == "5") {
                circle = new L.circle(circlePos, { radius: 50000 });
            }
            all = L.layerGroup([marker, circle]);
            mymap.addLayer(all);
        });
        marker.on('dragend', function (e) {
            if (circle) {
                mymap.removeLayer(circle);
            }
            circle = new L.circle(e.target.getLatLng(), { radius: 500 });
            all = L.layerGroup([marker, circle]);
            mymap.addLayer(all);
        });

        all = L.layerGroup([marker, circle]);
        mymap.addLayer(all);
    });
})

$（文档）.ready（函数（）{
var mymap=L.map（'map'）.setView（[51.505，-0.09]，13）；
L.tileLayer（'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png？访问令牌=xxx'{
属性：“地图数据©；贡献者，图像©”，
maxZoom:18，
id:“地图盒。街道”，
accessToken:'xxx'
}).addTo（mymap）；
var标记；
var圈；
var-all；
mymap.on（'click'，函数（e）{
如果（全部）{
mymap.removeLayer（全部）；
}
marker=新的L.marker（e.latlng，{draggable:true}）；
圆=新的L圆（e.latlng，{半径：500}）；
var circlePos=e.latlng；
$（'distance-selector'）。打开（'change'，函数（）{
如果（圆圈）{
mymap.removeLayer（圆形）；
}
如果（this.value==“”）{
圆=新的L.圆（圆，{半径：500}）；
}
如果（this.value==“1”）{
圆=新的L.圆（圆，{半径：500}）；
}
如果（this.value==“2”）{
圆=新的L.圆（圆，{半径：1000}）；
}
如果（this.value==“3”）{
圆=新的L.圆（圆，{半径：5000}）；
}
如果（this.value==“4”）{
圆=新的L.圆（圆，{半径：10000}）；
}
如果（this.value==“5”）{
圆=新的L.圆（圆，{半径：50000}）；
}
all=L.layerGroup（[标记，圆圈]）；
mymap.addLayer（全部）；
});
标记.on（'dragend'，函数（e）{
如果（圆圈）{
mymap.removeLayer（圆形）；
}
圆=新的L.circle（e.target.getLatLng（），{radius:500}）；
all=L.layerGroup（[标记，圆圈]）；
mymap.addLayer（全部）；
});
all=L.layerGroup（[标记，圆圈]）；
mymap.addLayer（全部）；
});
})

胡乱猜测：

$（“#距离选择器”）

缺少

？

为什么不直接将半径添加到选项值中？所以你不必把这些都放在这里。您只需选择该选项并将其值放入半径中即可。我如何才能做到这一点？我不知道删除所有

如果value=…

并替换为：

var radiusFromSelect=this.value；圆=新的L.圆（圆，{radius:radiusFromSelect}）