用JS的onclick怎么实现局部更新数据？

我在page里有一组带有onclick事情的图片，还有一个预放置内容的DIV；要实现的功能是点击某张图片时，DIV中显示相应的内容。请高手指教！

解决方案 »

  1.   

    那这个有点类似于tab选项卡的功能了。将tab头部放置图片，下面显示内容
    还有种方法是更加图片的click事件中的图片，获取信息用innerHTML or appendChild将内容加载到div中
      

  2.   

    只有一个预放置内容的DIV，意味着不是采用div的显示隐藏来显示不同内容，那么就只能使用ajax获取后台更新的内容，然后显示到那个预放置内容的DIV里面。
    建议使用jquery实现ajax，比较简单。
    需要以下几个步：
    1.每个图片对应有onclick事件，在事件响应中使用
    $.get("getData.aspx",{id:参数1,rnd:math.random()*1000},function(data){
        $("#预放置内容的DIV的id").html(data);
    });
    2.实现后台文件getData.aspx,根据传递过来的参数id来获取不同的内容。
      

  3.   

    还可以用几个页面，用超链接，_black。
      

  4.   


    <html>
    <head>
    <script  type="text/javascript" src="/Script/jquery-1.4.2.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $("#1").click(function(){
    $("#fun").html("111111111");});
    $("#2").click(function(){
    $("#fun").html("2222222");});
    $("#3").click(function(){
    $("#fun").html("33333333");});
    $("#4").click(function(){
    $("#fun").html("444444444");});
    });
    </script>
    </head>
    <body>
    <div id="fun"></div>
    <input type="button"  id="1" value="1" ></br>
    <input type="button"  id="2"  value="2"></br>
    <input type="button"  id="3" value="3"></br>
    <input type="button"  id="4" value="4"></body>
    </html>
      

  5.   

    js动态控制div的CSS属性，不需要显示的时候getElementById.style.display=none，要需要显示的时候改成block就可以，内容只要改变innerHTML就可以了