javascript回调中的文档实例?

时间:2018-04-27 03:31:49

标签: javascript html dom callback

我有html代码,可以在第一次加载时呈现表格。

在单选按钮事件上重绘表的回调在运行时会产生两个错误。

  

TypeError:docInstance.getElementById不是函数

     

TypeError:document.getElementById(...)为null

由于我删除了自定义界面,因此代码是部分的。

Html代码

<div id = "mytableanchor1" class="mytableanchor1"></div>
<div id = "mytableanchor2" class="mytableanchor2"></div>
<table>
<th>Select radio button:</th>
  <tr>
      <td>
      <input type="radio" name="button1" value="1" checked>1&nbsp; 
      <input type="radio" name="button1" value="2">2&nbsp; 
      </td>
  </tr>      
</table>

Javascript函数

<script>

function GetView(data)
{          
   var view = new google.visualization.DataView(data);
   return view;
}       

function RenderTable(data, elementId, docInstance) 
{
  var gdatatable = new google.visualization.DataTable();

  ..
  // initialize gdatatable with custom colors for cells using data
  ..

  // anchor the table at given html element
  var table = new google.visualization.Table (docInstance.getElementById(elementId));

  // draw the table
  table.draw(GetView(gdatatable), {showRowNumber: true/*some settings*/});

}

首先加载javascript代码

var global_data;
var global_buttonValue = '1';

...
...
global_data = data;

// pass document instance
RenderTable(global_data,'mytableanchor1', document); 
...          
...

无法正常工作的Javascript回调代码

function DocumentReady()
{                  
     // pass document instance
     $(document).on('click', "input[name=button1]", RenderTableCallback($(document)));
} 

// using closure scope to pass document instance as param to callback
// read about it here http://www.jstips.co/en/javascript/passing-arguments-to-callback-functions/
function RenderTableCallback(docInstance) 
{
    return function() {

        global_buttonValue = $(this).val();        
        ..
        // modify global_data using global_buttonValue  
        ..
        // now render global_data in table
        RenderTable(global_data,'mytableanchor1', docInstance);
  }
}

</script>

=======

FIX

修复是在函数DocumentReady()

中使用document而不是$(document)

0 个答案:

没有答案