谷歌地图api自动完成不能在ASP.net mvc4上运行

时间:2016-08-16 04:52:47

标签: jquery asp.net google-maps asp.net-mvc-4 autocomplete

我是asp net mvc4编程的新手,现在我正在尝试制作一个自动完成的地图位置并获取地址和纬度和经度。

教程 我正在关注https://developers.google.com/maps/documentation/javascript/examples/places-autocompletehttps://www.youtube.com/watch?v=_kHz9snOS-U的教程...... 它们都可以在我用记事本制作的单个.html中完美运行(我使用我的谷歌API密钥)。

问题这里的问题是当我在C#asp.net mvc4的项目中实现代码时,自动完成功能无效,我在浏览器中尝试使用F12告诉我这个: enter image description here

尝试过的解决方案我已经尝试过这个解决方案Jquery autocomplete not working on ASP.NET MVC 5它说它实现了_layout并且我试图让我的布局为null但是它仍然不适合我。

这是我的代码:

@{
    Layout = null;
}
<!DOCTYPE html>

<html>
<head>
    <title>Test Autocomplete</title>
</head>
<body>

    <script src="https://maps.googleapis.com/maps/api/js?key='change it to api key'&libraries=places"></script>
    <script type="text/javascript">
        google.maps.event.addDomListener(window, 'load', intilize);
        function intilize() {
            var autocomplete = new google.maps.places.Autocomplete(document.getElementById("txtautocomplete"));

            google.maps.event.addListener(autocomplete, 'place_changed', function () {

                var place = autocomplete.getPlace();
                var location = "Address: " + place.formatted_address + "<br/>";
                location += "Latitude: " + place.geometry.location.lat() + "<br/>";
                location += "Longitude: " + place.geometry.location.lng();
                document.getElementById('lblresult').innerHTML = location
            });

        };

    </script>

    <span>location:</span><input type="text" id="txtautocomplete" style="width:200px" placeholder="enter the adress" />
    <br><label id="lblresult"></label>

    <script src="@SiteHelper.GetBaseUrl()/Assets/global/plugins/jquery.min.js" type="text/javascript"></script>
    <script src="@SiteHelper.GetBaseUrl()/Assets/global/plugins/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
</body>
</html>

你能帮我解释为什么我的代码无法在.cshtml上运行吗?解决方案是什么?

0 个答案:

没有答案