我刚刚找到了答案。这里就是我的答案。

{% extends "base.html" %}
{% block head %}
{{super()}}
{% endblock %}

{% block navbar %}
{{super()}}
{% endblock %}


{% block content %}



<div class="row">
<ol class="breadcrumb">
    <li><a href="#">
        <em class="fa fa-home"></em>
    </a></li>
    <li class="active">Locations>Create Locations</li>
 </ol>
 </div><!--/.row  id="entry.id" id="uploadbanner"-->


 <div id="dvMap" style="width: 100%; height: 100%">
 </div>

<form role="form" action="/post/locations" method="post">
<label>Name:</label>
<input type="text" id="loc" name="name"/>
<label>Latitude:</label>
<input type="text" name="latitude" id="lat"/>
<label>Longitude:</label>
<input name="longitude" id="lng" type="text"/>
<input type="submit" class="btn btn-primary" value=" Submit ">
<input type="reset" class="btn btn-default" value="Reset">

</form>

{% endblock %}

我只是在 Javascript 文件夹中添加了脚本。

就像我的模板 base.html 源代码中的 <--static/assets/js/map.js --> 一样。

您的代码存在问题，即在创建 div 元素（id 为“dvMap”的元素）之前执行了 javascript 代码片段。因此，请将 javascript 代码片段放在 div 元素之后，如下所示，

{% extends "base.html" %}
{% block head %}
{{super()}}
{% endblock %}

{% block navbar %}
{{super()}}
{% endblock %}


{% block content %}

<div class="row">
 <ol class="breadcrumb">
    <li><a href="#">
        <em class="fa fa-home"></em>
    </a></li>
    <li class="active">Locations>create locations</li>
  </ol>
 </div>{# /.row  #}
<div class="row">
<div class="col-md-6">

{# <div id="dvMap" style="width: 50%; height: 50%"></div> #}
<form   role="form" action="/post/locations" method="post"  >
<input type="text" id="loc" name="name" class="form-control"/>
<input type="text" name="latitude" id="lat" class="form-control"/>
<input name="longitude" id="lng" type="text" class="form-control"/>
<input type="submit" class="btn btn-primary" value="Submit">
                                        <input type="reset" class="btn btn-default" value="Reset">

</form>

</div>

</div>
<div id="dvMap" style="width: 80%; height: 70%   ">
</div>

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDv8X0eEAWUtWZrHG_1XLB8gMNxgdcD0-U"></script>
    <script >
        window.onload = function () {
            var mapOptions = {
                center: new google.maps.LatLng(17.3850, 78.4867),
                zoom: 8,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var infoWindow = new google.maps.InfoWindow()
            var name;
            var lat;
            var lng;
            var latlngbounds = new google.maps.LatLngBounds();

            var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
            google.maps.event.addListener(map, 'click', function (e) {
                var latlng = new google.maps.LatLng(e.latLng.lat(), e.latLng.lng());
                var geocoder = geocoder = new google.maps.Geocoder();
                var marker = new google.maps.Marker({
                    position: latlng,
                    map: map,
                    title: 'Hello World!'
            });

                geocoder.geocode({ 'latLng': latlng }, function (results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                        if (results[1]) {

                        name= results[1].formatted_address;
                        lat=e.latLng.lat();
                        lng=e.latLng.lng();
                            alert("Location: " +name + "\r\nLatitude: " + lat + "\r\nLongitude: " +lng );
                       document.getElementById("loc").value=name;
                        document.getElementById("lat").value=lat;
                         document.getElementById("lng").value=lng;

                        }
                    }

                });
            });
        }
    </script>
{% endblock %}

或者在 static 文件夹中创建一个单独的 js 文件（此处我将其命名为 custom.js 作为示例），其中包含 javascript 代码，并在文件末尾添加 <script src='{{ url_for('static', filename='custom.js') }}'></script> 。

希望这对您有所帮助。

PS：- 在 jinja2 模板文件中发表评论时，请使用 jinja2 注释标签。您可以在 这里 参考。