Tuesday, February 20, 2007

Replacing Text in HTML Tables

One of my students asked me how to replace text in an HTML table when links were clicked. I thought it was a useful technique once we worked it out, so here it is.

The code:
<script type="text/javascript">
<!--
function fillTable(value)
{

var stuff_a = "This is some stuff.";
var stuff_b = "This is some <b>other</b> stuff.";
var content = document.getElementById('content');

if (value == 'a') {var stuff = stuff_a;}
if (value == 'b') {var stuff = stuff_b;}

content.innerHTML=stuff;
}
//-->
</script>

<table border="1">
<tr>
<td><a href="javascript:fillTable('a')">Choose me!</a></td>
<td rowspan="2"><div id="content">Default content.</div></td>
</tr>
<tr>
<td><a href="javascript:fillTable('b')">or me.</a></td>
</tr>
</table>


Unfortunately, Blogger won't let me insert Javascript so I can't show a running example on this site :P

1 comment:

  1. Dear my friend,

    You should good in programmer. I am a Land Surveyor from Malaysia. I would like to insert my plan into map google. Do you know how to do it?

    Best regards
    lai
    http://melakasurveyor.blogspot.com

    ReplyDelete