求点击改变内容的代码（要求能通过IE8安全保护）

本帖最后由 chate 于 2012-03-12 20:54:53 编辑

解决方案 »

  1.   

    要是用jquery写，很简洁,兼容IE8,firfox等 要包含jquery
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <table>
      <tr>
        <td><table width="100%">
      <tr align="center" id="controller">
        <td style="background-color:#0FF">网页</td>
        <td>知道</td>
        <td>谷歌图片</td>
        <td>淘宝</td>
      </tr>
    </table></td>
      </tr>
      <tr>
        <td id="searcher"><form action="http://www.baidu.com/s" target="_blank">
          <input name="word" type="text" value="" />
          <input type="submit" value="百度一下" />
        </form></td>
      </tr>
    </table><script type="text/javascript"> 
    jQuery('#controller td').click(function(){
        jQuery(this).css('background-Color','#0FF');
        jQuery(this).siblings().css('background-Color','');
    });
    </script> 
      

  2.   

    谢谢！
    点击后的搜索效果怎么没有变化啊？比如，点击了“谷歌图片”，搜索表单相应地变为：
    <td id="searcher"><form action="http://www.google.com.hk/search" target="_blank">
    <input name="q" type="text" value="" />
    <input type="hidden" name="tbm" value="isch">
    <input type="submit" value="搜索图片" />
    </form></td>
      

  3.   

    调整了下，基本是这样，具体你再改下
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head><body><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <title></title> 
    </head> 
    <body> <table>
      <tr>
        <td><table width="100%">
      <tr align="center" id="controller">
        <td style="background-color:#0FF">网页</td>
        <td>知道</td>
        <td>谷歌图片</td>
        <td>淘宝</td>
      </tr>
    </table>
    </td>
      </tr>  <tr>  <td>
      <table width="100%">
     <tr id="controller_search">
     <td id="searcher">
    <form action="http://www.baidu.com/s" target="_blank">
      <input name="word" type="text" value="" />
      <input type="submit" value="百度一下" />
    </form>
    </td> <td id="searcher" style="display:none;">
    <form action="http://www.google.com.hk/search" target="_blank">
    <input name="q" type="text" value="" />
    <input type="hidden" name="tbm" value="isch">
    <input type="submit" value="搜索图片" />
    </form>
    </td> <td id="searcher" style="display:none;">
    <form action="http://www.baidu.com/s" target="_blank">
      <input name="word" type="text" value="" />
      <input type="submit" value="谷歌" />
    </form>
    </td> <td id="searcher" style="display:none;">
    <form action="http://search8.taobao.com/search?q" target="_blank">
      <input name="q" type="text" value="" />
      <input type="submit" value="淘宝一下" />
    </form>
    </td> </tr>
    </table>  </td></tr>
    </table><script type="text/javascript">  jQuery('#controller td').click(function(){
         var curIndex = jQuery(this).index();
                 jQuery(this).css('background-Color','#0FF');
          jQuery(this).siblings().css('background-Color','');
          jQuery('#controller_search td').eq(curIndex).css("display","block");
          jQuery('#controller_search td').eq(curIndex).siblings().css("display","none");
    });

    </script> 
    <div> 
    </div> 
    </body> 
    </html> 
      

  4.   

    谢谢freedom_gooboy！
    每次点击的时候，输入框里的内容要重新输入，可以像好123等导航网站那样无论如何点击选择，输入框里的内容都保持原样吗？