0

我目前有一些代码，当您按下提交按钮时，应根据下拉列表框中的值在地图上放置一个标记。我已经做到了，下拉框中的值将通过 PHP 代码的 GET 表单方法进入 URL，并且还将通过参数将值传递给 javascript 函数。

我遇到的问题是我必须按两次提交按钮才能使标记出现在地图上。这不太理想，我正在寻找一些帮助来尝试解决这个问题。谢谢。

这是javascript函数代码：

function placeMarker(address) 
        {       
            // ... Set up map code here

            var map = new google.maps.Map(document.getElementById("universityMap"), myOptions);

            <?php
                $uniname = $_GET['uninames'];       

                //Get the Uni code according to the uni name
                $queryUniID = $mysqli->prepare("SELECT IdCode FROM universityid WHERE UniName = ?");
                $queryUniID->bind_param('s', $uniname);
                $queryUniID->execute();
                $queryUniID->bind_result($unicode);
                $queryUniID->fetch();
                $queryUniID->close();

                //Load the question data into relevant variables
                $queryQuestions = $mysqli->prepare("SELECT QuestionNo, Answered1, Answered2, Answered3, Answered4, Answered5 FROM nssdata WHERE UniID = ?");
            ?>

            address = address + ", UK";
            geocoder.geocode({'address': address}, function(results, status) 
            {
                if (status == google.maps.GeocoderStatus.OK) 
                {
                    marker = new google.maps.Marker(
                    {
                        map: map,
                        position: results[0].geometry.location,
                        title: address, 
                        draggable: false
                    });
                }
                else 
                {
                    alert(status);
                }
            });
        }

这是我的html表单：

        <form action="#" onsubmit="placeMarker(this.uninames.value)" method="get">
4

1 回答 1

1

如果您的值都在适当的范围内，这实际上应该有效。在测试它的简化版本时，我可以输入一个地址，单击提交，标记就会显示在它们应该在的位置。

关于为什么在看到结果之前单击两次，我有一些理论。

(1)查找延迟：确保跟踪地理编码器状态并给它足够的时间来执行。

(2)故障：在某些地图渲染器中，您有时需要循环地图以获取标记。例如，这组连续调用：marker.setMap( null ); marker.setMap( map );将隐藏/显示一个标记，有时会取消显示。

(3)提交中断：如果接口比你说的更复杂并且可能干扰，你的表单提交（#）可能需要阻止提交。换句话说，您必须在单击提交后阻止浏览器转到# 地址，这样您才能让 JavaScript/ajax 完成它的工作。

这是表格的简化版本；注意return(false)部分 - 它防止浏览器地址更改为 #。

<form action="#" onsubmit="placeMarker('adr');return( false );" method="get">
    <input type="text" id="id_address" />
    <input type="submit" />
</form>

请注意，我将此地址简化为文本；在我的实际测试中，我以这种方式发送数据：

placeMarker(document.getElementById('id_address').value);

于 2012-04-05T13:15:44.033 回答