如何在 JavaScript 函数中使用 MySQL 数据库数据 - How to use MySQL DB data inside JavaScript function?

How to use MySQL DB data inside JavaScript function?

我需要填充JavaScript函数创建的图表。图表应填充 MySQL 数据库数据。我在 myquery.php 中定义了 SQL 查询。此 php 代码返回一个应该用于创建图表的数组。问题是如何执行 myquery.php并获取我可以在 JavaScript 函数 createChartControl 中进一步使用的输出数组？

<script type="text/javascript" language="JavaScript">
function createChartControl(htmlDiv1)
{
   // Draw chart
}
(function(){
    createChartControl('schedule');
})();
</script>

jQuery将使你的AJAX生活变得更加轻松。如果你真的反对使用库，你可以看看xmlhttprequest的例子，它可以在纯javascript中使用。

jQuery看起来像这样：

function ajaxCall(){
    $.ajax({
         url: 'myquery.php',
         type: 'POST',
         data: {any_var: var_value},
         success: function(data) {
                  var returned_array = $.parseJSON(data)
                  createChartControl(htmlDiv1, returned_array)
                  }
    })
}

基本上，您将所需的任何数据发送到myquery.php在any_var中，在myquery中检索该值.php使用$_POST['any_var']，运行查询，然后json_encode要传递回javascript的数组，最后在成功函数中解析返回的data为可用的javascript对象。现在你可以用它做你想做的事，但在我的例子中，你可以看到我把returned_array发送到你的createChartControl()函数（它需要为你的数组添加一个参数。

塔达，阿贾克斯的魔术。

我强烈建议你在JS端使用jQuery库。（ http://jquery.com/）

1 - 没有 Ajax：（如果加载页面时您的数据可用）：

<script type="text/javascript" language="JavaScript">
var myData = <?php echo json_encode($myArray); ?>;
function createChartControl(htmlDiv1)
{
   // your code to draw chart
   // read myData a fill the chart
}
(function(){
    createChartControl('schedule');
})();
</script>

2 - 使用 ajax（使用 jQuery）：

function loadMyData(){
 $.getJSON('ajax/myquery.php', function(data) {
  var items = [];
  $.each(data, function(key, val) {
    items.push(val);
  });
  $('<ul/>', {
    'class': 'my-new-list',
    html: items.join('')
  }).appendTo('body');
 });
}

有用的网站：
http://php.net/manual/pt_BR/function.json-encode.php
http://api.jquery.com/jQuery.getJSON/在 JavaScript 中解析 JSON？