运行通过ajax加载的谷歌可视化（javascript）

长时间监听器，第一次调用者。不太擅长ajax。想必我在这里做的事情非常密集：运行通过ajax加载的谷歌可视化（javascript）

试图运行一个从ajax响应中返回html的谷歌可视化，但即使我可以在firebug的xhr响应中看到代码，它在加载时不会运行ajax页面。

直接访问response2.php？var = X，它完美地工作，所以推测它本身没有问题。

（我搬到JSAPI和AJAX页面的页眉和response2.php之间的google.load（可视化），但没有成功无论哪种方式）

Ajax调用

$.ajaxSetup ({ 
    cache: false 
}); 

$.ajax ({ 
    type: "GET", 
    url: "return2.php", 
    data: "council=Leeds City Council", 
    dataType: "html", 
    success: function (responseText) { 
     document.getElementById('result').innerHTML = responseText; 
    } 
});

RETURN2。 PHP

<?php 
$docKey = "0Aqk6sC3LBlfjdHUxRDIycjlSM3NvX0JCWnhxUjRUbFE"; 
$docQuery = $_GET['council']; 
?> 
<script type="text/javascript"> 
function drawVisualization() { 
google.visualization.drawChart({ 
    "containerId": "councilViz", 
    "dataSourceUrl": "http://spreadsheets.google.com/a/google.com/tq?key=<?php echo $docKey; ?>", 
    "query":"SELECT A,B,C WHERE A CONTAINS '<?php echo $docQuery; ?>'", 
    "chartType": "Table", 
    "options": { 
     "width": 560, 
     "height" : 200 
    } 
}); 
} 
google.setOnLoadCallback(drawVisualization); 
</script> 
<div id="councilViz"> 
<?php echo $docQuery; ?> 
</div>

response2.php拾取GET变量，运行一个谷歌SPRE adsheets API查询并返回下面的代码：

Ajax响应

<script type="text/javascript"> 
    function drawVisualization() { 
    google.visualization.drawChart({ 
    "containerId": "councilViz", 
    "dataSourceUrl": "http://spreadsheets.google.com/a/google.com/tq?key=0Aqk6sC3LBlfjdHUxRDIycjlSM3NvX0JCWnhxUjRUbFE", 
    "query":"SELECT A,B,C WHERE A CONTAINS 'Leeds City Council'", 
    "chartType": "Table", 
    "options": { 
     "width": 560, 
     "height" : 200 
    } 
}); 
    } 
    google.setOnLoadCallback(drawVisualization); 
</script> 
<div id="councilViz"> 
Leeds City Council</div>

尝试，因为我可能，我不能当代码被称为AJAX的表格绘制。我可以看到结果，但没有任何可视化脚本。

非常感谢，

一个

来源

2012-04-09 andrew

您需要创建div来插入返回的HTML到，使用.innerHTML插入你的HTML到该专区。

然后使用.appendChild将div附加到dom中的目标。

通过设置元素的innerHTML属性添加的脚本不会被执行。

 
function addScript(responseText) 

    { 
     var newdiv = document.createElement('div'); 
     newdiv.innerHTML = responseText; 
     document.getElementById('target').appendChild(newdiv); 
    }

来源

2012-04-09 17:21:37

杰森，谢谢你的回答。我应该指出Ajax页面确实包含用于码一个div（#result）被放置到，像这样：

<脚本类型= “文本/ JavaScript的”> ... 要写信给我，我是否简单地将“成功”功能与您的解决方案交换，将“目标”更改为“结果”？ – andrew 2012-04-09 18:10:08

是的，与结果交换目标并在响应中运行addScript函数。 – 2012-04-15 22:32:40

运行通过ajax加载的谷歌可视化（javascript）

回答

相关问题