初学jQuery，求助！


<!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>
    <title>什么事jQuery?</title>
    <style type="text/css">
        h5.head
        {
            background-color: Gray;
            width: 100px;
            height: 20px;
        }        .content
        {
            visibility: hidden;
        }
    </style>
    <!--<script type="text/javascript" language="javascript">
        window.onload = function () {
            alert("Hello!");
        }
    </script>-->
    <script type="text/javascript" language="javascript" src="Scripts/jquery-1.4.1.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            alert("Hello!");
        });        $(function () {
            $("#panel h5.head").bind("click", function () {
                $(this).next("div.content").show();
            });
        });        $(document).ready(function () {
            alert("Hello2!");
        });
    </script>
</head>
<body>
    <div id="panel">
        <h5 class="head">
            什么是jQuery?</h5>
        <div class="content">
            jQuery 是继 prototype 之后又一个优秀的 Javascript 框架。 其宗旨是—写更少的代码,做更多的事情。 它是轻量级的 js 库(压缩后只有21k)，这是其它的
            js 库所不及的，它兼容 CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。 jQuery是一个快速的，简洁的
            javaScript 库，使用户能更方便地处理 HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。
        </div>
    </div>
</body>
</html>
请问中间那段JavaScript的代码有啥问题吗？为什么没运行呢？
前后的"Hello"、"Hello2"都能正常提示出来，中间那个貌似不行，我点了标题以后，没有动作。我用的是IE9、Google浏览器。不知道问题在哪？代码不正确吗？还是浏览器的问题。
还有一个问题，我打一个断点，却提示“当前不会命中断点。还没有为该文档加载任何符号。”网上搜的方法我也试过，不行。我用的是VS2010.求各位指点一二！

解决方案 »

  1.   

    show显示隐藏的匹配元素。这个就是 'show( speed, [callback] )' 无动画的版本。如果选择的元素是可见的，这个方法将不会改变任何东西。无论这个元素是通过hide()方法隐藏的还是在CSS里设置了display:none;，这个方法都将有效。改为
            .content
            {
                display:none;        }
      

  2.   

    .content { display: none; }show()方法等价于.css("display", "block");
      

  3.   

    show() 没有参数是立即显示，  里面可以写参数，参数表示多少毫秒显示出来，有动作
      

  4.   

     $(function () {
                $("#panel h5.head").bind("click", function () {
                    alert('aa');
                    $(this).next("div.content").css('visibility','visible');
                });
            });
    这样就行了
    vs对于js没法打端点。。只能通过一些工具调试。。
      

  5.   

    我换个机器试了，代码没问题了。
    但是我自己的机器上，点了<h5>标题元素后，没由反应，不知道咋回事。
      

  6.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
     <head>
      <title> New Document </title>
      <meta name="Generator" content="EditPlus">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
      <style type="text/css">
            h5.head
            {
                background-color: Gray;
                width: 100px;
                height: 20px;
            }        .content
            {
                visibility: hidden;
            }
        </style>  <script type="text/javascript" language="javascript" src="D:\ets_test\Js\jquery-1.4.2.min.js"></script>
      <script type="text/javascript">
            $(document).ready(function () {
                alert("Hello!");
            });        /*$(function () {
                $("#panel h5.head").bind("click", function () {
                    $(this).next("div.content").show();
                });
            });*/
    $(document).ready(function(){
    $(".head").click(function(){
    $(".content").css('visibility','visible');
    });
    });        $(document).ready(function () {
                alert("Hello2!");
            });
        </script>
     </head> <body>
      <div id="panel">
            <h5 class="head">
                什么是jQuery?</h5>
            <div class="content">
                jQuery 是继 prototype 之后又一个优秀的 Javascript 框架。 其宗旨是—写更少的代码,做更多的事情。 它是轻量级的 js 库(压缩后只有21k)，这是其它的
                js 库所不及的，它兼容 CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。 jQuery是一个快速的，简洁的
                javaScript 库，使用户能更方便地处理 HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。
            </div>
        </div> </body>
    </html>