Gmap , jQuery 和谷歌地图

Question

我正在尝试向我的网站添加一个简单的谷歌地图，其中包括 jQuery 。 我得到的唯一错误是：

GET http://code.jquery.com/jquery.min.map 404 (Not Found)  

这里是相关的代码部分，所有的插件都在头：

<!--jquery ,js scripts  -->
    <link rel="stylesheet" href="styles.css" />
    <link rel="stylesheet"href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
    <!--js scripts -->
    <script src="jsCode.js"></script> 
    <script src ="sirJson.js"></script>
    <!--gMap plugin API -->
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
    <script src = "gmap.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

Javascript 代码：

$( document ).ready(function() {
        var map = new GMaps({
        el: '#map',
        lat: 51.5073346,
        lng: -0.1276831,
        zoom: 12,
        zoomControl : true,
        zoomControlOpt: {
        style : 'SMALL',
        position: 'TOP_LEFT'
        },
    panControl : false,
    });

最后是我的 html，地图的 jQuery div：

<div data-role="main" class="ui-content">
        <div id="map"></div>
    </div>

修正错误 - jQuery's jquery-1.10.2.min.map is triggering a 404 (Not Found)

但地图仍然没有显示在地图页面中。

JS代码：

$( document ).ready(function() {
        var map = new GMaps({
        el: '#map',
        lat: 51.5073346,
        lng: -0.1276831,
        zoom: 12,
        zoomControl : true,
        zoomControlOpt: {
        style : 'SMALL',
        position: 'TOP_LEFT'
        },
    panControl : false,
    });

map - div 元素。

Answer 1

我建议看看this 它清楚地解释了这个错误是什么

编辑

更具体。要摆脱该错误，您需要做的事情如下（我将使用 jquery v1.11.0）：

1. 下载地图文件和 jQuery 的未压缩版本。将它们与缩小版本（同一文件夹）放在一起。大家可以here

2. 将 minified（仅缩小后的）版本包含到您的 HTML（标头中的脚本标记）中。

3. 检查您首选的 js 调试控制台，确保错误已消失。

希望这能让事情更清楚。

祝你好运。

Answer 2

为什么要使用 2 个 jquery 脚本。

首先只使用下面的一个脚本

 <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

你最终的脚本结构是这样的：

 <link rel="stylesheet" href="styles.css" />
    <link rel="stylesheet"href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
    <!--js scripts -->
    <script src="jsCode.js"></script> 
    <script src ="sirJson.js"></script>
    <!--gMap plugin API -->
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
    <script src = "gmap.js"></script>

Answer 3

jQuery 包含一个sourceMappingURL，以便更轻松地调试缩小代码，您可以从http://code.jquery.com/jquery-1.9.1.min.map 获取映射文件。