将PHP变量传递给javascript以在Google地图上显示IP的位置

在同一个页面上，您正在使用php代码返回域的ip，我想将这个php$ip变量传递给下面的javascript代码，在button标记中。如何将这个php$ip变量传递到下面的javascript代码中

以下是php提交部分，不含谷歌地图：

<form method="post" action="">
    <input type="text"  name="name">
    <input type="submit" name="submit" value="submit">
</form>

<?php 
if(isset($_POST['submit']))
{
    $ip = gethostbyname($_POST['name']);
    echo $ip;
}
?>

下面是代码中的javascript代码：我想传递上面的php$ip变量 我想删除这个javascript代码中的输入标记和按钮标记，因为它们在单个页面上存在两个输入和提交按钮标记

我在这个项目中的目标是查找IP的位置并在google地图上显示它

<script type="text/javascript">
    $(function(){
        try{
            IPMapper.initializeMap("map");
            //IPMapper.addIPMarker("111.111.111.111");
        } catch(e){
            //handle error
        }
    });
</script>

<input id="ip" name="ip" type="text" />
    <button onclick="IPMapper.addIPMarker($('#ip').val());">Geocode</button>
    <div id="map" style="height: 500px;width:500px; ">
</div>

供参考：javascript中的IPMapper代码

/*!
 * IP Address geocoding API for Google Maps
 * http://lab.abhinayrathore.com/ipmapper/
 * Last Updated: June 13, 2012
 */
var IPMapper = {
    map: null,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    latlngbound: null,
    infowindow: null,
    baseUrl: "http://freegeoip.net/json/",
    initializeMap: function(mapId){
        IPMapper.latlngbound = new google.maps.LatLngBounds();
        var latlng = new google.maps.LatLng(0, 0);
        //set Map options
        var mapOptions = {
            zoom: 1,
            center: latlng,
            mapTypeId: IPMapper.mapTypeId
        }
        //init Map
        IPMapper.map = new google.maps.Map(document.getElementById(mapId), mapOptions);
        //init info window
        IPMapper.infowindow = new google.maps.InfoWindow();
        //info window close event
        google.maps.event.addListener(IPMapper.infowindow, 'closeclick',
                function() {
                    IPMapper.map.fitBounds(IPMapper.latlngbound);
                    IPMapper.map.panToBounds(IPMapper.latlngbound);
                });
    },
    addIPArray: function(ipArray){
        ipArray = IPMapper.uniqueArray(ipArray); //get unique array elements
        //add Map Marker for each IP
        for (var i = 0; i < ipArray.length; i++){
            IPMapper.addIPMarker(ipArray[i]);
        }
    },
    addIPMarker: function(ip){
        ipRegex = /^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/;
        if($.trim(ip) != '' && ipRegex.test(ip)){ //validate IP Address format
            var url = encodeURI(IPMapper.baseUrl + ip + "?callback=?"); //geocoding url
            $.getJSON(url, function(data) { //get Geocoded JSONP data
                if($.trim(data.latitude) != '' && data.latitude != '0' && !isNaN(data.latitude)){ //Geocoding successfull
                    var latitude = data.latitude;
                    var longitude = data.longitude;
                    var contentString = "";
                    $.each(data, function(key, val) {
                        contentString += '<b>' + key.toUpperCase().replace("_", " ") + ':</b> ' + val + '<br />';
                    });
                    var latlng = new google.maps.LatLng(latitude, longitude);
                    var marker = new google.maps.Marker({ //create Map Marker
                        map: IPMapper.map,
                        draggable: false,
                        position: latlng
                    });
                    IPMapper.placeIPMarker(marker, latlng, contentString); //place Marker on Map
                } else {
                    IPMapper.logError('IP Address geocoding failed!');
                    $.error('IP Address geocoding failed!');
                }
            });
        } else {
            IPMapper.logError('Invalid IP Address!');
            $.error('Invalid IP Address!');
        }
    },
    placeIPMarker: function(marker, latlng, contentString){ //place Marker on Map
        marker.setPosition(latlng);
        google.maps.event.addListener(marker, 'click', function() {
            IPMapper.getIPInfoWindowEvent(marker, contentString);
        });
        IPMapper.latlngbound.extend(latlng);
        IPMapper.map.setCenter(IPMapper.latlngbound.getCenter());
        IPMapper.map.fitBounds(IPMapper.latlngbound);
    },
    getIPInfoWindowEvent: function(marker, contentString){ //open Marker Info Window
        IPMapper.infowindow.close()
        IPMapper.infowindow.setContent(contentString);
        IPMapper.infowindow.open(IPMapper.map, marker);
    },
    uniqueArray: function(inputArray){ //return unique elements from Array
        var a = [];
        for(var i=0; i<inputArray.length; i++) {
            for(var j=i+1; j<inputArray.length; j++) {
                if (inputArray[i] === inputArray[j]) j = ++i;
            }
            a.push(inputArray[i]);
        }
        return a;
    },
    logError: function(error){
        if (typeof console == 'object') { console.error(error); }
    }
}

也许

<button onclick="IPMapper.addIPMarker($('<?php echo $ip ?>').val());">Geocode</button>

---

不是javascript方面的专家，更好的解决方案是将数据添加到元素并使用事件侦听器

/*!
 * IP Address geocoding API for Google Maps
 * http://lab.abhinayrathore.com/ipmapper/
 * Last Updated: June 13, 2012
 */
var IPMapper = {
    map: null,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    latlngbound: null,
    infowindow: null,
    baseUrl: "http://freegeoip.net/json/",
    initializeMap: function(mapId){
        IPMapper.latlngbound = new google.maps.LatLngBounds();
        var latlng = new google.maps.LatLng(0, 0);
        //set Map options
        var mapOptions = {
            zoom: 1,
            center: latlng,
            mapTypeId: IPMapper.mapTypeId
        }
        //init Map
        IPMapper.map = new google.maps.Map(document.getElementById(mapId), mapOptions);
        //init info window
        IPMapper.infowindow = new google.maps.InfoWindow();
        //info window close event
        google.maps.event.addListener(IPMapper.infowindow, 'closeclick',
                function() {
                    IPMapper.map.fitBounds(IPMapper.latlngbound);
                    IPMapper.map.panToBounds(IPMapper.latlngbound);
                });
    },
    addIPArray: function(ipArray){
        ipArray = IPMapper.uniqueArray(ipArray); //get unique array elements
        //add Map Marker for each IP
        for (var i = 0; i < ipArray.length; i++){
            IPMapper.addIPMarker(ipArray[i]);
        }
    },
    addIPMarker: function(ip){
        ipRegex = /^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/;
        if($.trim(ip) != '' && ipRegex.test(ip)){ //validate IP Address format
            var url = encodeURI(IPMapper.baseUrl + ip + "?callback=?"); //geocoding url
            $.getJSON(url, function(data) { //get Geocoded JSONP data
                if($.trim(data.latitude) != '' && data.latitude != '0' && !isNaN(data.latitude)){ //Geocoding successfull
                    var latitude = data.latitude;
                    var longitude = data.longitude;
                    var contentString = "";
                    $.each(data, function(key, val) {
                        contentString += '<b>' + key.toUpperCase().replace("_", " ") + ':</b> ' + val + '<br />';
                    });
                    var latlng = new google.maps.LatLng(latitude, longitude);
                    var marker = new google.maps.Marker({ //create Map Marker
                        map: IPMapper.map,
                        draggable: false,
                        position: latlng
                    });
                    IPMapper.placeIPMarker(marker, latlng, contentString); //place Marker on Map
                } else {
                    IPMapper.logError('IP Address geocoding failed!');
                    $.error('IP Address geocoding failed!');
                }
            });
        } else {
            IPMapper.logError('Invalid IP Address!');
            $.error('Invalid IP Address!');
        }
    },
    placeIPMarker: function(marker, latlng, contentString){ //place Marker on Map
        marker.setPosition(latlng);
        google.maps.event.addListener(marker, 'click', function() {
            IPMapper.getIPInfoWindowEvent(marker, contentString);
        });
        IPMapper.latlngbound.extend(latlng);
        IPMapper.map.setCenter(IPMapper.latlngbound.getCenter());
        IPMapper.map.fitBounds(IPMapper.latlngbound);
    },
    getIPInfoWindowEvent: function(marker, contentString){ //open Marker Info Window
        IPMapper.infowindow.close()
        IPMapper.infowindow.setContent(contentString);
        IPMapper.infowindow.open(IPMapper.map, marker);
    },
    uniqueArray: function(inputArray){ //return unique elements from Array
        var a = [];
        for(var i=0; i<inputArray.length; i++) {
            for(var j=i+1; j<inputArray.length; j++) {
                if (inputArray[i] === inputArray[j]) j = ++i;
            }
            a.push(inputArray[i]);
        }
        return a;
    },
    logError: function(error){
        if (typeof console == 'object') { console.error(error); }
    }
}

<button data-ip-marker="<?= htmlspecialchars($ip) ?>">Geocode</button>

---

我几乎尝试过调用php变量，但它不起作用。我在这里发布了一个php代码，这是谷歌地图的IP地址地理编码API。我想将php$IP变量传递到这个代码中。很抱歉没有提供详细信息。我是这个组的新手，正在尝试张贴