值没有从html表单传递到Javascript，变量记录未定义，为什么？_Javascript_Jquery_Google Maps

值没有从html表单传递到Javascript，变量记录未定义，为什么？

javascript jquery google-maps

值没有从html表单传递到Javascript，变量记录未定义，为什么？,javascript,jquery,google-maps,Javascript,Jquery,Google Maps,我正在尝试为班级制作一个小网站，根据下拉选择改变地图。第一个贴图弹出得很好，因为我硬编码了lat和long值，但是当您使用下拉框时，这些值返回时未定义。我不认为这是通过正确的，我不明白为什么 <!DOCTYPE HTML> <head> <meta charset='utf-8'> <link href ='style.css' rel='stylesheet' /> <script async defer src=

我正在尝试为班级制作一个小网站，根据下拉选择改变地图。第一个贴图弹出得很好，因为我硬编码了lat和long值，但是当您使用下拉框时，这些值返回时未定义。我不认为这是通过正确的，我不明白为什么

 <!DOCTYPE HTML>
<head>
    <meta charset='utf-8'>
    <link href ='style.css' rel='stylesheet' />
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=[hidden]"></script>

    <title>Geolocation</title>
</head>
<body>
    <div id="map"></div>
    <div id="formArea">
        <form>
            <h1>Famous Cities</h1>
            <fieldset>
                <label>Cities</label>
                <select id="selectedCity" name="selectedCity">
                    <option value='None'>Please select a city from the dropdown</option>
                    <option value='ITA'>Rome, Italy</option>
                    <option value='FRA'>Paris, France</option>
                    <option value='USA'>New York, USA</option>
                </select>
            </fieldset>
        </form>
    </div>
<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src='script.js'></script>
</body>
</html>

这是因为您将事件对象传递给changeSelection方法。您需要传递一个值：

$("#selectedCity").change(function() {
  changeSelection($(this).val());
});

这会起作用，因为jQuery在处理程序对DOM元素的回调中设置了这一点。Per:

无论何时调用jQuery的.each方法或它的一个事件方法在jQuery集合上，回调函数的上下文- 设置为DOM元素

你在打电话吗

$("#selectedCity").change(changeSelection);

而您的函数changeSelection需要一个参数

function changeSelection(loc) { ... }

您可能希望获得select的值，因此我建议：

$("#selectedCity").change(function({changeSelection($("#selectedCity").options[$("#selectedCity").selectedIndex].value);});

啊，很好用。我花了一点时间来理解你的意思，但是如果我理解正确的话，在我的例子中，changeSelection只是传入元素，而不是值，所以它指的是这个对象，val提取的是实际值？粗略的解释，但这是我能解释的最好方式lol@Jordan我做了一点更新。。。在这种情况下已传递事件对象，请参见：处理程序类型：函数事件对象

$("#selectedCity").change(function({changeSelection($("#selectedCity").options[$("#selectedCity").selectedIndex].value);});