javascript - 将参数传递给 'document.getElementById'

标签 javascript html charts google-visualization

我正在尝试将 div id 作为参数传递给 document.getElementById()

我尝试使用以下功能,但仍然无法正常工作。

function getID(Element_ID) {
        var el = document.getElementById(Element_ID);
        el.style.visibility = "visible";
        if(el.style.display == "none" ) {
            el.style.display = "inline";
        }
        else {
            el.style.display = "visible";
        }
        return el;//in case you want to use the element
}

代码:

<html>
   <head>
      <title>Google Charts Tutorial</title>
      <script type = "text/javascript" src = "https://www.gstatic.com/charts/loader.js"></script>
      <script type="text/javascript" src="https://www.google.com/jsapi"></script>


      <script type = "text/javascript">
         google.charts.load('current', {packages: ['corechart']});     
      </script>
       <script language = "JavaScript">
         function drawChart(DivID){
            // Define the chart to be drawn.
            var data = google.visualization.arrayToDataTable([
               ['Status', 'Outcome', { role: 'style' }],
               ['Executed - 70', 70,'green'],
               ['Not Executed 5', 5,'red']
            ]);
    var groupData = google.visualization.data.group(
    data,
    [{column: 0, modifier: function () {return 'total'}, type:'string'}],
    [{column: 1, aggregation: google.visualization.data.sum, type: 'number'}]
  );

  var formatPercent = new google.visualization.NumberFormat({
    pattern: '#,##0.0%'
  });

  var formatShort = new google.visualization.NumberFormat({
    pattern: 'short'
  });

  var view = new google.visualization.DataView(data);
  view.setColumns([0, 1, 2,{
    calc: function (dt, row) {
      var amount =  formatShort.formatValue(dt.getValue(row, 1));
      var percent = formatPercent.formatValue(dt.getValue(row, 1) / groupData.getValue(0, 1));
      return amount + ' (' + percent + ')';
    },
    type: 'string',
    role: 'annotation'
  }]);

        var options = { title: 'Coveo (700341)', 'legend':'none'}; 

        var chart = new google.visualization.ColumnChart(document.getElementById(DivID));
        chart.draw(view, options);
     }
     google.charts.setOnLoadCallback(drawChart);
      </script>
   </head>

   <body>
 <table border='1px' cellpadding='5' cellspacing='0' style='border: solid 1px Silver; font-size: x-small;width: 100%'>
 <tr align='center' valign='top'>
<td align='center' style='width:100px' valign='center' bgcolor='white'>
    <div id="container1" style="width:400; height:280"></div>
    <script type="text/javascript">
   drawChart('container1');
</script>
</td>
 </tr>
</table>
   </body>
</html>

当我将 document.getElementById(DivID) 更改为 document.getElementById('container1') 时它起作用。还尝试将 google.charts.setOnLoadCallback(drawChart) 更改为 google.charts.setOnLoadCallback(drawChart('container1'))。一点运气都没有。

最佳答案

回调函数不会传递任何参数,
改用匿名函数......

google.charts.setOnLoadCallback(function () {
  drawChart('container1');
});

关于javascript - 将参数传递给 'document.getElementById',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57992969/

相关文章:

asp.net - 如何在 Javascript onunload 元素中进行异步调用?

javascript - 水平扩展的 HTML 输入字段

javascript - 修复谷歌分析的跳出率

api - 您如何在Google Visualization Chart API中设置百分比?

javascript - 一页上有多个 Google 图表 - 有效加载库?

javascript - 有没有一种方法可以使用 Javascript 或 jQuery 来启动 Chrome Find? (与 ctrl + f 相同)?

javascript - 如何使用 jQuery Flip 为 div 设置动画

javascript - 在正则表达式中匹配多个输入值

charts - 在 flutter 中调用多个不同的图表 - charts_flutter 0.5.0 Package

javascript - 将 JavaScript 组件包含到 Blazor 组件中