Can'；我无法让twitter引导程序中的javascript正常工作

我正在尝试按照本网站上的说明进行操作：

我已经按照说明进行了操作，甚至复制并粘贴了准确的代码。你能告诉我怎么了吗？我已经验证了所有代码都位于正确的目录中。以下是我的网站上显示的内容的图像：

这是我的代码，CSS添加在标题中，不在下面的代码中：

<div id="body">
        <div class="row-fluid breadcrumbs margin-bottom-30">
            <div class="container">
                <h1 class="pull-left">Book Now!</h1>

            </div><!--/container-->
        </div><!--/breadcrumbs-->

    <div class="container">     
            <div class="row-fluid">
                <div class="span9">


        <div class="row-fluid acc-wizard">
          <div class="span3" style="padding-left: 2em;">
            <p style="margin-bottom: 2em;">
              Follow the steps below to add an accordion wizard to your web page.
            </p>
            <ol class="acc-wizard-sidebar">
              <li class="acc-wizard-todo"><a href="#prerequisites">Prerequisites</a></li>
              <li class="acc-wizard-todo"><a href="#addwizard">Add Wizard</a></li>
              <li class="acc-wizard-todo"><a href="#adjusthtml">Adjust HTML</a></li>
              <li class="acc-wizard-todo"><a href="#viewpage">Release</a></li>
            </ol>
          </div>
          <div class="span9">
            <div class="accordion" id="accordion-demo">
              <div class="accordion-group">
                <div class="accordion-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-demo" href="#prerequisites">
                    Install Bootstrap and jQuery
                  </a>
                </div>
                <div id="prerequisites" class="accordion-body collapse in">
                  <div class="accordion-inner">
                    <form id="form-prerequisites">
                      <p>
                        The accordion wizard depends on two other open source packages:
                        <ul>
                          <li>The Bootstrap framework, available <a href="http://twitter.github.com/bootstrap/index.html">here</a>.
                          <li>The jQuery javascript library, available <a href="http://jquery.com">here</a>.
                        </ul>
                        Note that Bootstrap itself depends on jQuery for its interactive
                        components, so if you're using Bootstrap you probably already have
                        jQuery as well.
                      </p>
                      <p>
                        You'll include the CSS styles for Bootstrap in the
                        <code>&lt;head&gt;</code> of your HTML file, for example:
                      </p>
                      <pre><!--
                      -->&lt;link href="css/bootstrap.min.css" rel="stylesheet"&gt;
    <!--              -->&lt;link href="css/bootstrap-responsive.min.css" rel="stylesheet"&gt;<!--
                      --></pre>
                      <p>
                        and you'll include jQuery and Bootstrap javascript files at the
                        end of your <code>&lt;body&gt;</code> section, for example:
                      </p>
                      <pre><!--
                      -->&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
    <!--              -->&lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;<!--
                      --></pre>
                    </form>
                  </div> <!--/.accordion-inner -->
                </div> <!-- /#prerequisites -->
              </div> <!-- /.accordion-group -->

              <div class="accordion-group">
                <div class="accordion-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-demo" href="#addwizard">
                    Add Accordion Wizard
                  </a>
                </div>
                <div id="addwizard" class="accordion-body collapse in">
                  <div class="accordion-inner">
                    <form id="form-addwizard">
                      <p>
                        If you haven't already found it, the source code for the
                        accordion wizard is available on github
                        <a href="https://github.com/sathomas/acc-wizard">here</a>.
                        There are two main folders, <code>/src</code> and
                        <code>/release</code>.
                      </p>
                      <p>
                        There are two different ways to add the accordion wizard to
                        your pages. The simplest approach is just to add the CSS and
                        javascript files from the <code>/release</code> folder
                        directly in your HTML without modifying them:
                      </p>
                      <pre><!--
                      -->&lt;link href="css/bootstrap.min.css" rel="stylesheet"&gt;
    <!--              -->&lt;link href="css/bootstrap-responsive.min.css" rel="stylesheet"&gt;
    <!--              -->&lt;link href="css/acc-wizard.min.css" rel="stylesheet"&gt;<!--
                      --></pre>
                      <p>
                        and
                      </p>
                      <pre><!--
                      -->&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
    <!--              -->&lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
    <!--              -->&lt;script src="js/acc-wizard.min.js"&gt;&lt;/script&gt;<!--
                      --></pre>
                      <p>
                        The release styles for the accordion wizard are based on
                        Bootstrap's default styles. If you've tweaked the Bootstrap
                        styles (e.g. by changing the link color), you'll want to
                        make corresponding tweaks to <code>acc-wizard.min.css</code>.
                      </p>
                      <p>
                        Alternatively, if you're building custom CSS and javascript,
                        then you might want to start with the files in the <code>/src</code>
                        folder and adapt them to your source code. The <code>/src</code>
                        folder contains a LESS file and uncompressed (and commented)
                        javascript. Note that the <code>acc-wizard.less</code> file
                        depends on variables defined in Bootstrap's <code>variables.less</code>
                        file.
                    </form>
                  </div> <!--/.accordion-inner -->
                </div> <!-- /#addwizard -->
              </div> <!-- /.accordion-group -->

              <div class="accordion-group">
                <div class="accordion-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-demo" href="#adjusthtml">
                    Adjust Your HTML Markup
                  </a>
                </div>
                <div id="adjusthtml" class="accordion-body collapse in">
                  <div class="accordion-inner">
                    <form id="form-adjusthtml">
                      <p>
                        Now you can modify your HTML markup to activate the accordion
                        wizard. There are two parts to the markup&mdash;the collapsible
                        accordion itself and the task list. I prefer putting both in
                        the same <code>.row</code> with the task list taking up a
                        <code>.span3</code> and the accordion panels in a <code>.span9</code>,
                        but that's not a requirement.
                      </p>
                      <p>
                        The accordion panel can be exactly as documented in the
                        <a href="http://twitter.github.com/bootstrap/javascript.html#collapse">Bootstrap example</a>,
                        but I think there's a problem with the Bootstrap implementation.
                        Specifically, the Bootstrap example only adds the class
                        <code>.in</code> to one of the accordion panels. That class
                        marks the panel as visible by default. The problem with only
                        having one panel visible by default is that users without
                        javascript will <strong>never</strong> be able to see the other
                        panels. Sure, that's a minority of users, but why make your
                        pages unworkable even for a small minority. Instead, I suggest
                        adding <code>.in</code> to all your <code>.collapse</code>
                        elements and have javascript code select only one to make
                        visible when it runs. The accordion wizard javascript will handle
                        that for you if you choose to use that approach.
                      </p>
                      <p>
                        The sidebar task list is nothing but a standard HTML ordered
                        list. The only required additions are adding the
                        <code>.acc-wizard-sidebar</code> class to the <code>&lt;ol&gt;</code>
                        element and <code>.acc-wizard-todo</code> to the individual list
                        items. If you want to indicate that some steps are already
                        complete, you can instead add the <code>.acc-wizard-completed</code>
                        class to the corresponding <code>&lt;li&gt;</code> elements.
                      </p>
                      <pre><!--
                      -->&lt;ol class="acc-wizard-sidebar"&gt;
    <!--              -->  &lt;li class="acc-wizard-todo"&gt;&lt;a href="#prerequisites">Install Bootstrap and jQuery&lt;/a&gt;&lt;/li&gt;
    <!--              -->  &lt;li class="acc-wizard-todo"&gt;&lt;a href="#addwizard">Add Accordion Wizard&lt;/a&gt;&lt;/li&gt;
    <!--              -->  &lt;li class="acc-wizard-todo"&gt;&lt;a href="#adjusthtml">Adjust Your HTML Markup&lt;/a&gt;&lt;/li&gt;
    <!--              -->  &lt;li class="acc-wizard-todo"&gt;&lt;a href="#viewpage">Test Your Page&lt;/a&gt;&lt;/li&gt;
    <!--              -->&lt;/ol><!--
                      --></pre>
                      <p>
                        Finally, you'll want to active the wizard in your javascript.
                        That's nothing more than simply calling the plugin on an
                        appropriate selection.
                      </p>
                      <pre><!--
                      -->&lt;script&gt;
    <!--              -->    $(window).load(function() {
    <!--              -->        $(".acc-wizard").accwizard();
    <!--              -->    });
    <!--              -->&lt;/script&gt;<!--
                     --></pre>
                      <p>
                        The default options are probably fine for most uses, but
                        there are many customizations you can use when you activate
                        the wizard. Check out the documentation on
                        <a href="https://github.com/sathomas/acc-wizard">github</a>
                        for the details.
                      </p>
                    </form>
                  </div> <!--/.accordion-inner -->
                </div> <!-- /#adjusthtml -->
              </div> <!-- /.accordion-group -->

              <div class="accordion-group">
                <div class="accordion-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-demo" href="#viewpage">
                    Test Your Page
                  </a>
                </div>
                <div id="viewpage" class="accordion-body collapse in">
                  <div class="accordion-inner">
                    <form id="viewpage">
                      <p>
                        Naturally, the last thing you'll want to do is test your
                        page with the accordion wizard. Once you've confirmed that
                        it's working as expected, release it on the world. Your
                        users will definitely appreciate the feedback and guidance
                        it gives to multi-step and complex tasks on your web site.
                      </p>
                    </form>
                  </div> <!--/.accordion-inner -->
                </div> <!-- /#viewpage -->
              </div> <!-- /.accordion-group -->

            </div>
          </div>
        </div>

                </div>
            </div>
    </div>
    <script type="text/javascript" src="assets/js/acc-wizard.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="assets/js/bootstrap.min.js"></script>
    <script>
          function onNext(parent, panel) {
            hash = "#" + panel.id;
            $(".acc-wizard-sidebar",$(parent))
                .children("li")
                .children("a[href='" + hash + "']")
                .parent("li")
                .removeClass("acc-wizard-todo")
                .addClass("acc-wizard-completed");
          }
          $(window).load(function() {
            $(".acc-wizard").accwizard({onNext: onNext});
          })
        </script>

您将在

正文

部分的结尾，例如：

和

最后，您需要在javascript中激活向导。 这只不过是简单地调用一个插件 适当的选择。

剧本 $（窗口）。加载（函数（）{ $（“.acc向导”）.accwizard（）； }); /剧本 对于大多数使用，默认选项可能很好，但是 激活时可以使用许多自定义设置 巫师。查看有关的文档 详情请参阅。

当然，您最不想做的事情就是测试您的 用手风琴向导翻页。一旦你确认了这一点 它按预期工作，在全世界发布。你的 用户一定会感谢您的反馈和指导 它为您的网站提供了多步骤和复杂的任务。

函数onNext（父级，面板）{ hash=“#”+panel.id； $（“.acc向导侧栏”，$（父级）） .儿童（“li”） .children（“a[href=”“+hash+”]”） .父母（“li”） .removeClass（“acc向导todo”） .addClass（“acc向导已完成”）； } $（窗口）。加载（函数（）{ $（“.acc向导”）.accwizard（{onNext:onNext}）； })

---

你没有忘记这一点吗

---

订单很重要！您添加了这些库，但顺序错误。这是正确的：

---

你忘了在代码中添加bootstrap.js吗？我在编辑中添加了它。它就在代码的其他地方。抱歉。

acc\u向导

可能使用了引导和jquery，所以这应该是最后一个，而不是第一个。所以我应该把js文件放在前面？看看我的答案。这是来自

acc\u向导

页面的订单。很抱歉，我在另一部分中也包含了这些内容：我像那样添加了所有三个，但仍然没有更改。。。您想看看整个页面的源代码吗？是的，当然。这将是最好的办法。如果您的网站在线，请将链接放在此处。1。删除前两个脚本，然后在页面底部移动acc\u向导：

2。移动此

$（“.acc向导”）.accwizard（{onNext:onNext}）

与页面底部的

$（function（）{}

和

onNext

函数一起进入你的

$（function（）{}

）有什么错误？我们可以用另一种媒体交谈吗？我更新了网站，效果更好，但仍然不是100%。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js"></script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/acc-wizard.min.js"></script>

GET http://shield.sitelock.com/shield/maidsinmemphis.com 403 (Forbidden) index.php:363
GET http://www.maidsinmemphis.com/assets/elasticslides/css/style.css 404 (Not Found) index.php:25
GET http://www.maidsinmemphis.com/assets/css/acc-wizard.min.css 404 (Not Found) index.php:31
GET http://www.maidsinmemphis.com/assets/elasticslides/js/jquery.easing.1.3.js 404 (Not Found) index.php:387
GET http://www.maidsinmemphis.com/assets/elasticslides/js/jquery.eislideshow.js 404 (Not Found) index.php:387
GET http://www.maidsinmemphis.com/assets/js/acc-wizard.min.js 404 (Not Found) index.php:387
Uncaught TypeError: Object [object Object] has no method 'accwizard'