Question

这段代码有什么问题？它没有显示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>

Answer 1

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

替换

$( "37DIV" ).

与

$("#37DIV" ).

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

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

<!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时，应该使用更新版本。

Answer 2

在选择器中输入id之前需要#，请阅读有关selctors的更多信息here

更改

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

要

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

Answer 3

$（“＃37DIV”）。而不是$（“37DIV”）。其中＃指定ID

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

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

Answer 4

试试这个：

<!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>

Answer 5

如需切换，请查看以下内容

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

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

Jquery div没有显示点击

5 个答案: