修改

Question

<span id="city"></city>

这是我的代码。我能够获得lat和lon值并通过。但我无法通过城市。当我这样做时，我收到了错误。我在js中很弱，这是第一次做项目。请帮助我获得结果。我需要通过ajax请求发送城市名称。 html中的axisSet.xAxis.axisConstraints = [CPTConstraints constraintWithLowerOffset:40.0];为我提供了城市名称。如何在脚本中获取城市名称并通过ajax请求发送。请帮帮我？

Answer 1

我认为您试图将AJAX功能放在错误的位置。 getCurrentPosition是异步的，因此响应不一定立即可用 - 因此，您尝试发送的ajax请求应仅在获得getCurrentPosition

的响应时发送

<script>
    new Vue({ 
        el: '#fad' , 
        data: { 
            data: {}, 
        },
        mounted(){

            var self = this;
            navigator.geolocation.getCurrentPosition( success, error );


            function success( position ) {/* geolocation success callback */
                var GEOCODING = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + '%2C' + position.coords.longitude + '&language=en';
                $.getJSON( GEOCODING ).done( function( location ) {

                    $('#country').html(location.results[0].address_components[5].long_name);
                    $('#state').html(location.results[0].address_components[4].long_name);
                    $('#city').html(location.results[0].address_components[2].long_name);
                    $('#address').html(location.results[0].formatted_address);
                    $('#latitude').html(position.coords.latitude);
                    $('#longitude').html(position.coords.longitude);


                    /*

                        As this is an asynchronous process, make the 
                        ajax request here.

                    */
                    var lat = position.coords.latitude;
                    console.log( lat );

                    $.ajax({
                        url: 'https://api/post//',
                        data: {
                            lat: position.coords.latitude,
                            lon: position.coords.longitude,
                            city: location.results[0].address_components[2].long_name,
                            state: location.results[0].address_components[4].long_name,
                            country: location.results[0].address_components[5].long_name
                        },
                        type: 'POST',
                        dataType: 'json',
                        success: function(e) { 
                            if( e.status == 1 ) { 
                                self.data = e.data; 
                                console.log( e.data ) 
                            }
                        }
                    });
                });
            }

            function error( err ) {/* geolocation error callback */
                console.log( err )
            }
        }
    });
</script>

Answer 2

您的代码中存在语法错误，这就是它未运行的原因。

在你的$ .ajax调用中，你有一个分号

city:location.results[0].address_components[2].long_name;

这是语法错误，请删除尾随;

修改

您更新了答案并修复了跟踪;，旁边的代码似乎运行正常，请查看下面的代码段。

这是一个带有重新格式化代码的小片段。不要忘记更改您的$.ajax网址，除非您真的要张贴到https://api/post

＆＃13;

new Vue({
    el: '#fad',
    data: {
        data: {},
    },
    mounted() {
        var self = this;

        navigator.geolocation.getCurrentPosition(function () {


                var GEOCODING = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + '%2C' + position.coords.longitude + '&language=en';

                $.getJSON(GEOCODING).done(function (location) {
                    $('#country').html(location.results[0].address_components[5].long_name);
                    $('#state').html(location.results[0].address_components[4].long_name);
                    $('#city').html(location.results[0].address_components[2].long_name);
                    $('#address').html(location.results[0].formatted_address);
                    $('#latitude').html(position.coords.latitude);
                    $('#longitude').html(position.coords.longitude);
                });

                $.ajax({
                    url: 'https://api/post//',
                    data: {
                        lat: position.coords.latitude,
                        lon: position.coords.longitude,
                        city: location.results[0].address_components[2].long_name,
                    },
                    type: "POST",
                    dataType: 'json',
                    success: function (e) {
                        if (e.status == 1) {
                            self.data = e.data;
                            console.log(e.data)
                        }
                    }
                });


            },
            function () {

            });

    }
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>

<div id="fad"></div>

＆＃13;

如何将从地理位置获取的城市名称存储到变量并发送ajax请求？

2 个答案:

修改