1

这段代码有什么问题？它没有在点击时显示 37DIV

<a href="#" id="37" class="he"> CS504 </a>
<script>
$( "#37" ).click(function() {
    $( "37DIV" ).show( "bounce", 1000 );
});
</script>
<div id="37DIV" style="display:none">       
        <a href="thread-52.html">lorem pum sum</a>          
        <a href="thread-52.html">lorem pum sum</a>      
        <a href="thread-52.html">lorem pum sum</a>      
        <a href="thread-52.html">lorem pum sum</a>      
        </div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
4

5 回答 5

2

你忘记了告诉 jQuery 按 id 搜索的 #。

代替

$( "37DIV" ).

和

$("#37DIV" ).

您还应该在准备好的回调中准备好您的代码。

而且你必须在使用之前导入 jQuery。将导入元素放在文档的头部：

<!DOCTYPE html>
<html>
<head>
  <title> no title </title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
</head>
<body>
<a href="#" id="37" class="he"> CS504 </a>
<div id="37DIV" style="display:none">       
        <a href="thread-52.html">lorem pum sum</a>          
        <a href="thread-52.html">lorem pum sum</a>      
        <a href="thread-52.html">lorem pum sum</a>      
        <a href="thread-52.html">lorem pum sum</a>      
</div>
<script>
$(function(){
  $("#37").click(function() {
    $("#37DIV").show( "bounce", 1000 );
  });
});
</script>
</body>
</html>

请注意，以数字开头的 ID 在 HTML4 中无效（但这应该不是问题）。还要注意 jQuery 1.5 已经很老了。您应该使用更新的版本，因为您使用的是最近的 jQuery UI。

于 2012-12-08T15:00:50.117 回答
1

您需要在选择器中的 id 之前，在此处#阅读有关选择器的更多信息

改变

 $("37DIV" ).show( "bounce", 1000 );

到

 $("#37DIV" ).show( "bounce", 1000 );
于 2012-12-08T15:00:50.657 回答
1

$("#37DIV")。而不是 $("37DIV")。其中 # 指定 ID

$( "#37" ).click(function() {
    $( "#37DIV" ).show( "bounce", 1000 );
});

http://jsfiddle.net/TgZKn/5/

于 2012-12-08T15:04:10.400 回答
0

试试这个：

<!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" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>    
<script>
$(document).ready(function() {

    $( "#37" ).click(function() {
    $( "#37DIV" ).show("bounce", 1000);
});

});

</script>



</head>

<body>

<a href="#" id="37" class="he"> CS504 </a>
<div id="37DIV" style="display:none">       
        <a href="thread-52.html">lorem pum sum</a>          
        <a href="thread-52.html">lorem pum sum</a>      
        <a href="thread-52.html">lorem pum sum</a>      
        <a href="thread-52.html">lorem pum sum</a>      
        </div>
</body>
</html>
于 2012-12-08T15:13:36.827 回答
0

对于切换检查以下

$( "#37" ).click(function() {
    $( "#37DIV" ).toggle("bounce" );
});

http://jsfiddle.net/TgZKn/5/

于 2012-12-08T15:16:27.460 回答