jQuery手风琴（）不工作

我的jQuery手风琴（）不适用于我的HTML段落。我哪里做错了？jQuery手风琴（）不工作

simple.html

<!DOCTYPE html> 
<html> 
    <head> 
     <title></title> 
    </head> 
    <body> 
     <div id="mainContent"> 
      <h1>This is an According Example</h1>   
     </div> 
     <div id="accordion"> 
      <h3><a href="#">Heading for first sentence</a></h3> 
      <div> 
      <p>This is the first sentence.</p> 
      </div>   
      <h3><a href="#">Heading for second sentence</a></h3>    
      <div> 
      <p>This is the second sentence.</p> 
      </div> 
      <h3><a href="#">Heading for third sentence</a></h3> 
      <div> 
      <p>This is the third sentence.</p> 
      </div> 
     </div> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 
     <script src="myscript.js"></script> 
    </body> 
</html>

myscript.js

window.onload = function(){ 
    $("#accordion").accordion(); 
};

来源

2013-04-02 Anthony

我试着提供您的代码，虽然我在一个单独的脚本块中添加了window.load调用，并且按预期工作。您应该像其他人指出的那样，将手风琴代码放入“准备好文档”的监听器中。它不工作，还是看起来很奇怪 - 因为没有CSS文件，它看起来很奇怪，但仍然有效。 –

你的代码工作得很好 - http://jsfiddle.net/twgjW/。什么是“不工作”？使用'$（document）.ready'是首选，因为它不会等待外部资源（如图像）加载。它不会有很大的不同，但是你可能会一直使用jQuery。 – Ian

+1感谢您的回复。当我点击链接（例如标题的第一句）时，标题下方的句子不会消失或重新出现。 – Anthony

使用此...

<!DOCTYPE html> 
<html> 
    <head> 
    <title></title> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 
    <script src="myscript.js"></script> 
</head> 
<body> 
    <div id="mainContent"> 
     <h1>This is an According Example</h1>   
    </div> 
    <div id="accordion"> 
     <h3><a href="#">Heading for first sentence</a></h3> 
     <div> 
     <p>This is the first sentence.</p> 
     </div>   
     <h3><a href="#">Heading for second sentence</a></h3>    
     <div> 
     <p>This is the second sentence.</p> 
     </div> 
     <h3><a href="#">Heading for third sentence</a></h3> 
     <div> 
     <p>This is the third sentence.</p> 
     </div> 
    </div> 
</body>

而且把它放在磁头标签

<script> 
    $(document).on('ready', function(){ 
     $("#accordion").accordion(); 
    }); 
</script>

和se e这jsFiddle example

来源

2013-04-02 23:31:57

+1谢谢您的回复。这很有帮助。感谢jsFiddle的例子！ – Anthony

两个问题：你是不是包括jQuery UI的CSS，也是你的脚本必须包含您的<head>。使用这个：

<head> 
    <title>My Title</title> 
    <link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"> 
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> 
    <script>$(document).ready(function(){ $("#accordion").accordion(); });</script> 
</head>

并从页面底部删除脚本。

小提琴：http://jsfiddle.net/cxJW6/（这并不意味着什么，因为你的问题是与包括jQuery的+ jQuery用户界面在你的页面）

来源

2013-04-02 23:29:47 Mooseman

+1谢谢您的回复。这很有帮助。 – Anthony

请问我的帖子downvoted请让我知道为什么？ – Mooseman

$(document).ready(function() { 
     $("#accordion").accordion(); 
});

来源

2013-04-02 23:31:47

+1谢谢您的回复。这很有帮助！ – Anthony

jQuery手风琴（）不工作

回答

相关问题