在 JavaScript 中为 Google Maps V2 使用 PHP 变量答案

【问题标题】：Using PHP variable in JavaScript for Google Maps V2在 JavaScript 中为 Google Maps V2 使用 PHP 变量
【发布时间】：2012-03-05 06:31:08
【问题描述】：

我目前使用的是谷歌地图版本 2（抱歉使用旧版本，请不要建议我使用 V3，因为这是我们的要求）。基本上，此页面应允许用户添加地点并选择该地点的类型（例如餐厅、酒吧、学校等）。这些信息将被添加到数据库中并用于切换。添加地点现在正在工作，需要重定向到另一个 php 页面 (testmap.php)，以便它将在地图中显示标记。但是切换需要下拉列表中选择的类型的信息。我的问题是我不知道如何将类型与每个标记“关联”。我不知道如何从“类型”下拉列表中传输数据。

附言

倒数第四行是我的addNewMarker函数onSubmit中传输地址数据的代码。
上面的 PHP 代码是下拉列表，其中包含上述“类型”的可能值。
总而言之，我需要有关如何从下拉列表中获取标记类型并与 addNewMarker 函数一起传输的实际代码，以便 testmap.php 可以使用数据库中的值并且可以轻松切换。

非常感谢那些愿意帮助我的人！

 <script type="text/javascript">

            if(GBrowserIsCompatible()) {
                map_compatible = true;
            }

            /* Initialize the map this will be called when the document is loaded from: <body onLoad="initialize_map();"> */

            function initialize_map() {
                if( map_compatible ) {
                }       

            function addNewMarker(newAddress){
                var set;
                var lat;
                var longi;
                if(set==null){
                    set=1;
                    geocoder = new GClientGeocoder();
                    geocoder.getLatLng(newAddress, function(point){
                        if(!point){
                            alert(address + " not found");
                        }else{
                            lat = point.y;
                            longi = point.x;
                            alert("The latitude of " + newAddress + " is " + lat + " and longitude is " + longi);
                            default_address.push([latitude,longitude]);
                            location.href="testmap.php?lat="+lat+"&longi="+longi+"&set="+set+"&newAdd="+newAddress;
                        }                                                   
                    });
                }
            }

            function getType(type){
                //markertype = type;
                document.write("Hello");
            }


     </script>



        </head>

  <body onLoad="initialize_map();">

<div id="main-wrapper">
        <div id="main-padding"> 

    <div id="map_canvas"></div>
            <form name="markertype_form" method = "POST" action = "addMarker.php"  class="form">
                <?php
                    @$submit = $_POST['view'];
                    $selectedtype = '';
                    if(isset($_GET)){
                        $connect = mysql_connect("localhost","root","abc123");
                        mysql_select_db("mapping");
                        $query="SELECT id,typename FROM markertypes ORDER BY typename";

                        $result = mysql_query ($query);
                        echo "<select name='types'>";
                        $types = strip_tags(@$_POST['types']);
                        echo "<option disabled>---------------------Select---------------------</option>";
                        while($nt=mysql_fetch_array($result)){
                            $selected = false;
                            // check if the current value equals the value submited
                            if($_POST['types'] == $nt['id']){
                                $selected = true;
                                $selectedtype = $nt['typename'];
                            }
                            // show selected attribute only if $selected is true
                            echo "<option value='{$nt['id']}' ". ($selected ? "selected" : "") .">{$nt['typename']}</option>";
                        }
                        echo '</select>';
                        echo "</select>";
                        echo "<input type='submit' name ='view' value='View Details'>";// Closing of list box
                        echo '<br>';
                    }
                ?>

            </form>
            <form name="direction_form" onSubmit="addNewMarker(this.new_address.value); return false;" class="form">

                Add markers? Enter the address and we will mark it for you: <input type="text" name="new_address" class="form-field" /><br /><br />

                <input type="submit" value="  Mark this place!  " class="form-submit" />

            </form>

【问题讨论】：

标签： php javascript google-maps-api-2

【解决方案1】：

如果您在 php 中的类型选择框上添加了一个 id，那么您可以在上面的 javascript 中添加一些代码行。

以下假设“types”选择元素的 id 为“marker-type”：

function addNewMarker(newAddress){
            var set;
            var lat;
            var longi;
            var e = document.getElementById("marker-type");
            var mtype = e.options[e.selectedIndex].value;
            if(set==null){
                set=1;
                geocoder = new GClientGeocoder();
                geocoder.getLatLng(newAddress, function(point){
                    if(!point){
                        alert(address + " not found");
                    }else{
                        lat = point.y;
                        longi = point.x;
                        alert("The latitude of " + newAddress + " is " + lat + " and longitude is " + longi);
                        default_address.push([latitude,longitude]);
                        location.href="testmap.php?lat="+lat+"&longi="+longi+"&set="+set+"&newAdd="+newAddress+"&type="+mtype;
                    }                                                   
                });
            }
        }

请注意，在 AddMarker 函数中，我为“mtype”添加了一个新变量，它选择选择框并获取当前选项值。

然后，在 API 调用 testmap.php 的地方，我添加了类型选择器，并为其指定了“mtype”变量的值。

稍后在您的 testmap.php 代码中，您只需继续使用：

$_GET['type']

【讨论】：

非常感谢！那行得通！我不期待这个简短但很好的答案！帮了大忙！