google.load 上的 IE8 中神秘的“对象不支持此方法”错误答案

【问题标题】：Mysterious 'object doesnt support this method'error in IE8 on google.loadgoogle.load 上的 IE8 中神秘的“对象不支持此方法”错误
【发布时间】：2015-09-29 18:16:11
【问题描述】：

我在本地搜索应用程序中使用谷歌搜索 JSAPI。在除 IE 8 之外的所有浏览器中一切正常。问题出在我的 jquery 基础对象和 google 对象被引用的特定代码行之后。

这是一个直截了当的代码。我可以使用this jsfiddle 重现问题。

html代码是

<html>
    <head>
        <title>Test Map</title>
        <script src="http://www.google.com/jsapi?" type="text/javascript"></script>

    </head>
    <body>
        <div id="map_canvas"></div>
    </body>
</html>

和JS

$(function() {
    alert(1);
    google.load('search',1);
    alert($);

    google.setOnLoadCallback(function() {       
        alert(2);
    });
});

google.load('search',1) 之后出现以下错误

Error: Object doesn't support this property or method

在$ 和google 上。

这完全是一场噩梦。我在没有运气的情况下与这个斗争了几个小时。这里有任何 IE 专家有想法吗？

【问题讨论】：

标签： javascript internet-explorer google-api

【解决方案1】：

将您的 jsFiddle 更改为“No wrap (body)”并像这样修改您的函数...

//$(function() {
    //alert(1);
    google.load('search',1);
    alert($);

    google.setOnLoadCallback(function() {       
        alert(2);
    });
//});

这里问的几乎相同的问题：Google is not defined using Google Visualization API; possibly jQuery's fault

【讨论】：

@ChrisGessler 请在您的答案中添加对它不起作用的真正原因的解释。了解问题以及如何调试和修复问题至关重要。

【解决方案2】：

这个问题是由 Google 的load API 中的document.write 引起的，类似于this question。脚本被延迟，如下图所示：

要解决此问题，请不要将代码包装在 onload/domready 处理程序中。

<script src="http://www.google.com/jsapi?" type="text/javascript"></script>
<script>
// All load-related invocations have to be placed here.
google.load('search',1);
google.setOnLoadCallback(function() {       
    alert(2);
});
</script>

请注意，JSfiddle 会将任何内容放在<body> 标签内的左上角。因此，在 JSFiddle 中简单地复制粘贴代码不会显示正确的结果。

【讨论】：

附言。 JSfiddle，我在左上角粘贴了所有代码：jsfiddle.net/dgap5/4
@RameshVel JSFiddle 不是问题。真正的问题，正如详细解释的那样，是由谷歌的脚本加载器引起的，它使用document.write。
是的，我明白了.. 实际上我也测试了没有 jquery on-load 块的代码.. 但默认情况下 jsfiddle 用加载的文档包装它，所以我得到了同样的错误...... （我错过了）我指的是... :)

【解决方案3】：

我也遇到过同样的问题。解决方法如下。

如果你想在 JQuery 中使用谷歌可视化 api。请按照以下方法进行

<script type="text/javascript">
//Load the Google visualization library
google.load("visualization", "1.1", {packages:["bar"]});
$(document).ready(function() {
     google.setOnLoadCallback(function () {
        $('#Search').click(sendAndDraw);
     });

     $("#Search").click(function (e) {
     var data = google.visualization.arrayToDataTable([
         ['Technology', 'Beginner', 'Intermediate', 'Expert'],
         ['Java', 10, 40, 20],
         ['DOT NET', 11, 46, 25],
         ['Mainframe', 66, 11, 30],
         ['Oracle', 10, 50, 30]
       ]);


    var options = {
      chart: {
        title: 'Management Reports',
        subtitle: 'Classification of resources',
      }
    };

    var chart = new google.charts.Bar(document.getElementById('chart_div'));

    chart.draw(data, options);

});

【讨论】：