js求助

我想实现这样一种功能：页面的中间有一个方框，方框的周围有一些业务名称，单击业务名称可以在方框中显示各业务名称下的详细介绍，文字内容为主（最好能将指定的图片一起显示）。本人初学javascript，停留在document.write的水平，突然接到任务，无所适从，请大家指点，谢谢。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

首先定义一个数组来放置业务的详细信息
var array =new Array("first","second","third");
将业务的id设置为1，2等。onclick调用以下方法
function getInfoDetail(tempID)
{
  var detail = "";
  for(var i = 1;i<=array.length;i++)
  {
     if(tempID == i)
     {
      detail = array[i];
     }
  }
  document.getElementById(tempID).innerHTML = detail;
}
要和数据库交互的话还得用ajax，学习一下吧
如果业务项目不多的话，可以采用显示隐藏　div 来实现。
例：（注，未经测试，不保证代码正确性）<script>
function showDiv(id){
var obj = document.getElementById(id);
// if target not exists, exit process.
if (!obj){
return;
}

// if current have target showed, hide it.
if (!!document.currentObj){
document.currentObj.style.display = 'none';
}

// save current target.
document.currentObj = obj;

// show current target.
obj.style.display = '';
}
</script>
<style>
#detailPanel {border:1px solid black;width:300px;height:250px;float:left}
</style>
<div id='detailPanel'>
<div id='bs1' style='display:none'>
  name: bs1
  <br/>
  <img src='img1'/>
</div>
<div id='bs2' style='display:none'>
  name: bs2
  <br/>
  <img src='img2'/>
</div>
</div>
<div style='float:left;padding-left:50px;'>
<a href='javascript:showDiv("bs1")'>view bs1</a>
<br/>
<a href='javascript:showDiv("bs2")'>View bs2</a>
</div>
我是按下面的写的，但是肯定有问题，请大家指点。对于js的函数和onclick以及DOM一点都没接触........
<html>
<head></head><body><script type="text/javascript">

var intro = new Array( "first information ", "second information ");

function   getInfoDetail(tempID)
{
    var   detail   =   " ";
    for(var   i   =   1;i <=array.length;i++)
    {
          if(tempID   ==   i)
          {
            detail   =   intro[i];
          }
    }
    document.getElementById(3).innerHTML   =   detail;
}
</script>
<ul id="cmd">

      <li><a id="1" href="#" onclick="getInfoDetail(1)"><strong>first</strong> </a></li>
      <li><a id="2" href="#" onclick="getInfoDetail(2)"><strong>second</strong> </a></li>

</ul><div id="3"></div>
</body>
</html>
不是吧，我就是原文拷出来的，单击了first和second后没有“first information”和“second information”出来。那个Div id = "3"是不是需要定义一下？
<html>
<head> </head> <body> <script type="text/javascript">

var intro = new Array("first information", "second information ");

function  getInfoDetail(tempID)
{
    var  detail  =  " ";
    for(var  i  =  1;i <=intro.length;i++)
    {
          if(tempID  ==  i)
          {
            detail  =  intro[i];
          }
    }
    document.getElementById("3").innerHTML  =  detail;
}
</script>
<ul id="cmd">

      <li> <a id="1" href="#" onclick="getInfoDetail(1)"> <strong>first </strong> </a> </li>
      <li> <a id="2" href="#" onclick="getInfoDetail(2)"> <strong>second </strong> </a> </li>

</ul> <div id="3"> </div>
</body>
</html>
这样可以出来的(*^__^*)...