无法访问ajax代码中的variabel

cant reach variabel in ajax code

本文关键字：variabel 代码 ajax 访问      更新时间：2023-09-26

我正试图从另一个php文件访问一个变量，并将其设置在图表中。遗憾的是，图表没有显示任何内容（因为MachineActivityS = 0的起始值）。当我删除var MachineActivityS = 0;时，它会显示：MachineActivityS isn't defined。如果我在AJAX代码中设置了图表的所有内容，它就不会显示图表。

下面你可以找到代码：

<script type="text/javascript">
var MachineActivityS = 0;
$.ajax
({
url: 'MachineActivityS.php',
type: 'get',
success: function(response)
    {
        MachineActivityS = response;
    },
});
var hours =  parseInt( MachineActivityS / 3600 ) % 24; // uren
var minutes = parseInt( MachineActivityS / 60 ) % 60; // minuten
var amountOfProducts = Math.floor(((hours * 60) + minutes) * 1.8);
var barChartData = 
{
    labels : ["Activity in minutes","Number of products"],
    datasets : [
        {
            fillColor : "rgba(220,220,220,0.5)",
            strokeColor : "rgba(220,220,220,0.8)",
            highlightFill: "rgba(220,220,220,0.75)",
            highlightStroke: "rgba(220,220,220,1)",
            data : [minutes + (hours * 60), amountOfProducts]
        }
    ]
}
window.onload = function()
{
    var ctx = document.getElementById("canvas").getContext("2d");
    window.myBar = new Chart(ctx).Bar(barChartData, {
        responsive : false,
        animation: false        
    });
}   
</script>

如何达到该文件中的值并将其设置在图表中？

您正在回调中定义一个新的MachineActivityS。所以改变

success: function(response) {
  var MachineActivityS = response;
}

到此：

success: function(response) {
  MachineActivityS = response;
}

此外，由于AJAX调用是异步运行的，因此您还需要将使用MachineActivityS的所有内容移动到该回调中。

success: function(MachineActivityS) {
  var hours =  parseInt( MachineActivityS / 3600 ) % 24; // uren
  var minutes = parseInt( MachineActivityS / 60 ) % 60; // minuten
  var amountOfProducts = Math.floor(((hours * 60) + minutes) * 1.8);
  ...
}

编辑：要确保在页面加载并返回AJAX调用后绘制图表，请将$.ajax调用移动到window.onload事件处理程序中：

window.onload = function() {
  $.ajax({
    ...,
    success: function(MachineActivityS) {
      var hours =  parseInt( MachineActivityS / 3600 ) % 24; // uren
      var minutes = parseInt( MachineActivityS / 60 ) % 60; // minuten
      var amountOfProducts = Math.floor(((hours * 60) + minutes) * 1.8);
      var barChartData = ...;
      var ctx = document.getElementById('canvas').getContext('2d');
      window.myBar = new Chart(ctx).Bar(barChartData, {
        responsive : false,
        animation: false        
      });
    }
  });
};
相关文章：