HTML 使用Google Ajax加载的HTML5 Beginers布局

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTML 使用Google Ajax加载的HTML5 Beginers布局相关的知识，希望对你有一定的参考价值。

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>HTML5 Beginers Layout</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.4.2");
google.load("jqueryui", "1.8.2");
</script>
<!--[if lt IE 9]>
<script type="text/javascript" src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
    <header>
        <hgroup>
            <h1>Page Header</h1>
            <h2>Description May Go Here</h2>
        </hgroup>
    </header>

    <nav>
        <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Contact</a></li>
        </ul>
    </nav>

    <article>
        <header>
            <h1>Article Header</h1>
            <time datetime="2010-05-05" pubdate>June 25th 2010</time>
        </header>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
        <section>
            <header>
                <h1>Section Header</h1>
            </header>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
            <footer>
                <p>Section Footer</p>
            </footer>
        </section>
        <footer>
            Article Footer
        </footer>
    </article>

    <aside>
        <header>
            <h1>Siderbar Header</h1>
        </header>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    </aside>

    <footer>
        Page Footer
    </footer>

</body>
</html>

Google Geo Charts 未通过 ajax 调用加载

【中文标题】Google Geo Charts 未通过 ajax 调用加载【英文标题】：Google Geo Charts Not loading through ajax calls 【发布时间】：2014-06-19 23:28:15 【问题描述】：

我正在尝试通过 ajax 调用 加载 html 页面，并且该 html 页面包含以下代码。

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>   
function draw() 
        var data = google.visualization.arrayToDataTable([
                        ['Country', 'Popularity'],
                        ['Germany', 200],
                        ['United States', 300],
                        ['Brazil', 400],
                        ['Canada', 500],
                        ['France', 600],
                        ['RU', 700]
                        ]);

        var options = ;

        var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));

        chart.draw(data, options);
;

$(document).ready(function() 
                    setTimeout(function() 
                                    google.load("visualization", "1","callback" : draw);  
                                      , 1000); 
                    ); 

</script>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>

html

每次我尝试绘图时都会收到以下错误：

TypeError: google.visualization.GeoChart 不是构造函数

【问题讨论】：

你没有加载一个包。 我没有得到你@AntoJurković。 .比如如何让这段代码运行.. 【参考方案1】：

回复有点晚，但如果有用，这是您修改后的工作代码，

将其包含在您的脚本中

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>



function draw() 
var data = google.visualization.arrayToDataTable([
                        ['Country', 'Popularity'],
                        ['Germany', 200],
                        ['United States', 300],
                        ['Brazil', 400],
                        ['Canada', 500],
                        ['France', 600],
                        ['RU', 700]
                    ]);

                    var options = ;

                    var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));

                    chart.draw(data, options);
                
                ;

                        google.load("visualization", "1", packages: ["corechart", "table"]);

                        google.setOnLoadCallback(draw);

【讨论】：

以上是关于HTML 使用Google Ajax加载的HTML5 Beginers布局的主要内容，如果未能解决你的问题，请参考以下文章

可以在页面加载后拦截 ajax 加载的 HTML/数据的 Google Chrome 扩展

Google Geo Charts 未通过 ajax 调用加载

加载CDN加速服务地址

history.js + Google [关闭]

谷歌地图ajax和php

Vue 组件和 AJAX 加载的 HTML 内容