简单的jQuery无法加载

Question

我正在尝试重新学习HTML / CSS / JavaScript并遇到我正在构建的网站的问题。我在Squarespace上尝试实现jQuery。我有简单的代码，它将无法正常工作。请让我知道我做错了什么。

这是我的“页面代码注入”

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

这是在我的实际页面中：

<div id="accordion">

<h3>Section 1</h3>
  <div>
    <p>
      Blah
    </p>
  </div>
  <h3>Secion 2</h3>
  <div>
    <p> lalala
    </p>
   </div>
</div>

我需要声明“text / javascript”吗？我尝试添加“https”，声明HTML5等等......

请帮忙！我四处搜寻。

谢谢。

Answer 1

如果您使用本地，则会查找不存在的file://。使用此：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script>$(function() {$( "#accordion" ).accordion();});</script> <!-- To call accordion-->

编辑：使用//，查看js控制台中的错误：

Answer 2

我假设您想要实际使用jQuery UI中的accordion小部件？在这种情况下，您需要实际运行一些代码来告诉jQuery您想要这样做。

在导入两个脚本的标签后，添加：

<script>
 $(function() {
     $( "#accordion" ).accordion();
 });
</script>

这告诉jQuery找到标识为accordion的标记，并在其上运行函数.accordion()，在jQuery UI中将其转换为手风琴小部件。

另请注意，协议较少的网址旨在让您可以在http:和https之间切换，而无需更改代码。不幸的是，如果您从文件系统（file:）运行页面，它将无法工作，因为它将尝试从本地硬盘驱动器加载脚本。如果您在本地运行，请在URL的开头明确添加http:。

Answer 3

要使用jQuery UI手风琴，您需要进行设置：

 <script>
  $(function() {
    $( "#accordion" ).accordion();
  });
 </script>

另外，请确保您的HTML标记符合手风琴插件的预期：

<div id="accordion">
    <h3>Section 1</h3>
    <div>
        <p>Lorem</p>
    </div>
        <h3>Section 2</h3>
    <div>
        <p>Ipsum</p>
    </div>
</div>

最后，请确保您还包含jQuery UI的CSS：

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />

  

请参阅此链接：http://jqueryui.com/accordion/

Answer 4

要使用手风琴UI小部件，您需要像这样实例化它：

  <script>
  $(function() {
    $( "#accordion" ).accordion();
  });
  </script>

加载外部源后。

可以在文档中找到：http://jqueryui.com/accordion/

点击“查看来源”链接。