2

这是我发现的创建可排序表的代码。我想让表格中的文字链接到列出的文章。我怎样才能做到这一点？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Sortable Table</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1.1', {packages: ['controls']});
</script>
<script type="text/javascript">




  function drawVisualization() {
    // Prepare the data.
    var data = google.visualization.arrayToDataTable([
      ['Article', 'Year'],
      ['Article 1 link', 2012],
      ['Article 2 link', 2006],
      ['Article 3 link', 2010],
      ['Article 4 link', 1996],
      ['Article 5 link', 2002],
      ['Article 6 link', 1999],
      ['Article 7 link', 1942],
      ['Article 8 link', 2012]
    ]);

    // Define a StringFilter control for the 'Article' column
    var stringFilter = new google.visualization.ControlWrapper({
      'controlType': 'StringFilter',
      'containerId': 'control1',
      'options': {
        'filterColumnLabel': 'Article'
      }
    });

    // Define a table visualization
    var table = new google.visualization.ChartWrapper({
      'chartType': 'Table',
      'containerId': 'chart1',
      'options': {'height': '13em', 'width': '20em'}
    });

    // Create the dashboard.
    var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard')).
      // Configure the string filter to affect the table contents
      bind(stringFilter, table).
      // Draw the dashboard
      draw(data);
  }

  google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <div id="dashboard">
      <table>
        <tr style='vertical-align: top'>
          <td height="200" style='width: 300px; font-size: 0.9em;'>
        <div id="control1"></div>
        <div id="control2"></div>
        <div id="control3"></div>
      </td>
      <td style='width: 600px'>
        <div style="float: left;" id="chart1"></div>
        <div style="float: left;" id="chart2"></div>
            <div style="float: left;" id="chart3"></div>
          </td>
        </tr>
      </table>
    </div>
  </body>
</html>

​</p>

4

0 回答 0