Javascript仅在刷新后给出值

Question

我有一个名为requestData()的函数。其他值显示在HTML中（valueYTD，valueMAA等），但valueCurrent不会{i}添加console.log，因此有效地推动它运行。

但是我不想在我的脚本中使用console.log作为一种在没有刷新的情况下显示所有值的hacky方式。请问最好的方法是什么？我尝试使用return和&&运算符来返回所有查询，但这不起作用。

birst是我从中获取数据的地方，数据存储在哪里。这是从requestData到handleResponse ....的异步问题。

var executeQueryResultHandler;
var processQueriesHandler;


var birstFilters = [];
var birstQueryIds = [];

var birstVis = {
  id: 0,

  callBack: function(listener) {
    window.onmessage = function(e) {
      if (e.data.operation === "executeQueryResult") {
        if (birstQueryIds.indexOf(e.data.callerId) >= 0) {
          listener(e);
        }
      } else {
        listener(e);
      }
    };
  },
  postData: function(data) {
    this.report.postData(data);
  },
  getData: function(query) {
    if (!this.report) {
      this.report = new BirstReport();
    }
    this.messageId = this.getQueryId(query)
    birstQueryIds.push(this.messageId);
    this.report.getData(query, this.messageId);
  },
  init: function() {
    this.callBack(birstResponseHandler);
    this.id = guid();
  },
  start: function() {
    getFilters();
  },
  getQueryId: function(query) {
    return (this.id + query).split("").
    reduce(function(a, b) {
      a = ((a << 5) - a) + b.charCodeAt(0);
      return a & a
    }, 0);
  },
};



function birstResponseHandler(e) {

  var birstOperation = e.data.operation;

  if (birstOperation === "setFilters") {
    handleSetFilters(e);

  } else if (birstOperation === "executeQueryResult") {
    executeQueryResultHandler(e);
  }
}

function handleSetFilters(e) {
  //clear any existing ids
  birstQueryIds.clear;

  //set new filters
  birstFilters = e.data.filters;

  //reprocess queries
  processQueriesHandler();
}


function getWhereStatement() {
  if (birstFilters === undefined || birstFilters.length === 0) //if undefined or an empty list
    return '';

  var statement = ' WHERE ';

  for (var i = 0; i < birstFilters.length; i++) {
    var filter = birstFilters[i];

    statement += '[';
    statement += filter.key;
    statement += ']';

    if (filter.operator === '=')
      statement += ' IN ';
    else
      statement += ' NOT IN ';

    statement += '(';

    for (var j = 0; j < filter.value.length; j++) {
      var value = filter.value[j];

      statement += '\'';
      statement += value;
      statement += '\'';

      if (j !== filter.value.length - 1)
        statement += ',';
    }
    statement += ')';

    if (i < birstFilters.length - 1)
      statement += ' AND ';
  }

  return statement;
}


function getFullBasicQuery(selectStatement) {
  return selectStatement + getWhereStatement();
}

// CONFIGURATION

var kpis = {

  K025: {
    id: 'GRP-K025',
    title: 'Employee Absence %',
    clickThrough: 'Employee Absence %',
    periodExp: 'SELECT (SavedExpression(\'GRP K025 MONTH ACT\'))',
    ytdExp: 'SELECT (SavedExpression(\'GRP K025 YTD ACT\'))',
    maaExp: 'SELECT (SavedExpression(\'GRP K025 MAA ACT\'))',
    periodRag: 'SELECT (SavedExpression(\'GRP K025 MONTH ACT RAG\'))',
    ytdRag: 'SELECT (SavedExpression(\'GRP K025 YTD ACT RAG\'))',
    maaRag: 'SELECT (SavedExpression(\'GRP K025 MAA ACT RAG\'))',
    ragType: 'reduction',
    startSymbol: '',
    endSymbol: '%',
    decimal: 1
  }
};

var constants = {
  current: '\'Current\' FROM [ALL] ',
  ytd: '\'YTD\' FROM [ALL] '
};


var kpi;

var birstVisKPIGroupBoxes = {
  init: function(configuration) {
    kpi = configuration;

    executeQueryResultHandler = handleResponse;
    processQueriesHandler = requestData;
    birstVis.init();

  }
};

//DATA REQUEST

function requestData() {

  var valueCurrent = getQuery(kpi.periodExp, constants.current);
  var valueYTD = getQuery(kpi.ytdExp, constants.ytd);
  var valueMAA = getQuery(kpi.maaExp, constants.current);

  birstVis.getData(valueCurrent);
  birstVis.getData(valueYTD);
  birstVis.getData(valueMAA);

}

function handleResponse(e) {

  var currentValueId = birstVis.getQueryId(getQuery(kpi.periodExp, constants.current));
  var ytdValueId = birstVis.getQueryId(getQuery(kpi.ytdExp, constants.ytd));
  var maaValueId = birstVis.getQueryId(getQuery(kpi.maaExp, constants.current));

  switch (id) {
    case currentValueId:
      updateValue(kpi, 'cur', e);
      return;
    case ytdValueId:
      updateValue(kpi, 'ytd', e);
      return;
    case maaValueId:
      updateValue(kpi, 'maa', e);
      return;

  }
}

function updateValue(kpi, id, e) {


  var htmlId = kpi.id + '-' + id + '-val';

  var value = e.data.result.rows[0][0];

  var valueString;

  if (isFinite(value)) {
    valueString = kpi.startSymbol + numberFormat(value, kpi.decimal) + kpi.endSymbol;
  } else {
    valueString = 'NA';
  }

  $('#' + htmlId).html(valueString);

}

function getQuery(query, constant) {
  return getFullBasicQuery(query + constant);
}

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Arriva Group KPIs</title>
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script type="text/javascript" src="https://stage.sde.birst.com/js/birst_embed.js"></script>


  <script>
    window.onload = function() {
      birstVisKPIGroupBoxes.init(kpis.K025);
      birstVis.start();
    }
  </script>
</head>

<body>
  <span class="col_Detail three_col_left box_Detail">
            <div class="heading_Detail">Period</div>
    <div class="detail">
            <span class="date_Detail monthYear"></span>
  <span class="value_Detail" id="GRP-K025-cur-val"></span>

  </div>
  </span>

  <span class="col_Detail three_col_mid box_Detail">
            <div class="heading_Detail">YTD</div>
    <div class="detail">
            <span class="date_Detail monthYear"></span>
  <span class="value_Detail" id="GRP-K025-ytd-val"></span>

  </div>
  </span>

  <span class="col_Detail three_col_right box_Detail">
            <div class="heading_Detail">MAA</div>
    <div class="detail">
            <span class="date_Detail monthYear"></span>
  <span class="value_Detail" id="GRP-K025-maa-val"></span>

  </div>
  </span>


</body>

</html>