php条件下怎么实现点击左边记录名，具体内容在页面右边显示

php条件下如何实现点击左边记录名，具体内容在页面右边显示？
我做了一个网页，左边的一列是逐条显示的记录名，是我通过循环语句从mysql中读取并每行显示出来的。而右边是每条记录的具体内容框架（就是很多空框）。希望实现的目标是：点击左边任何一条记录名称，在右边的各个空框中就具体显示出该记录具体内容（其实就是每个字段的内容给填充到每个空框中去）。
该用怎样的简单框架实现左边的记录名称可点击呢？然后又传递什么变量来控制读取记录，把具体记录信息从mysql读取出来呢（貌似有了该记录内容，显示在各个空框中不难，我可以完成这一步）？当然该每条记录的具体内容在mysql都已经存在，查询即可。


这里的大牛们请多多帮忙啊，这是我第一次问问，事关紧急啊。谢谢。

分享到：
------解决方案--------------------
demo地址  http://www.colg.biz/demo/d1.php

代码

显示页

<br>
<?php <br />
	header("Content-Type:text/html;charset=utf-8");<br>
	mysql_connect('localhost','colg_demo','colg__');<br>
	mysql_select_db('colg_demo');<br>
	function getdata($sql)<br>
	{<br>
		$result=mysql_query($sql);<br>
		if($result)$count = mysql_num_rows($result);<br>
		for($i=0;$i
		{<br>
			mysql_data_seek($result,$i);<br>
			$data[$i] = mysql_fetch_assoc($result);<br>
		}<br>
		return $data;<br>
	}<br>
<br>
	$data = getdata("select * from demo");<br>
	<br>
?><br>
<style><br />
	.left{float:left;width:100px;border:1px solid grey;height:300px;}<br />
	.right{float:left;width:800px;border:1px solid grey;height:300px;margin-left:15px;}<br />
	.left_button{margin:5px;border:1px solid #ccc;cursor:pointer;}<br />
	td{margin:1px;border:1px solid #ccc;}<br />
</style><br>
<br>
<script></script><br>
<script><br />
	$(document).ready(function(){<br />
		$(".left_button").click(function(){<br />
			$(this).css("background","#EEE");<br />
			$(this).siblings().css("background","white");<br />
			var n = $(this).text();<br />
			$.ajax({<br />
				type:"get",<br />
				url:"ajax.php",<br />
				data:{<br />
					n:n<br />
				},<br />
				success:function(msg){<br />
						msg = eval("("+msg+")")<br />
					$(".show_tr").html(msg);<br />
				}<br />
			});<br />
		});<br />
<br />
	});<br />
	<br />
</script><br>
<br>
<div>
<br>
	<?php  foreach($data as $each){?><br>
		<div><?php  echo $each['col3'];?></div>
<br>
	<?php  } ?><br>
</div><br>
<div>
<br>
	<table>
<br>
		<tr>
<br>
			<td>id</td> <div class="clear">
                 
              
              
        
            </div>
</tr>
</table>
</div>