Question

我已经复制了http://jsfiddle.net/ia_archiver/9AgUS/中的文件：

<?xml version="1.0" encoding="utf-8"?>
<!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" lang="en" xml:lang="en">
<head>
<title>MWE Scrollspy</title>
<link rel="stylesheet" type="text/css" href="/path/to/scrollspy.css" />
</head>

<body data-spy="scroll" data-target="#navbar">
    <div id="post1" class="box">
        <h1>Post 1</h1>
        <p> Scroll Down?</p>
    </div>
    <div id="post2" class="box"><h1>Post 2</h1></div>
    <div id="post3" class="box"><h1>Post 3</h1></div>

    <div id="navbar">
        <ul class="nav">
            <li><a href="#post1">Post 1</a></li>
            <li><a href="#post2">Post 2</a></li>
            <li><a href="#post3">Post 3</a></li>
        </ul>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-scrollspy.js"></script>
</body>
</html>

在scrollspy.html中，并且：

@import url(http://getbootstrap.com/2.3.2/assets/css/bootstrap.css);
html{ background: #fff;}
.box{
    margin: 20px; padding: 15px;
    background: #eee;
    height: 500px;
}
#navbar{
    position: fixed;
    bottom: 0; left: 20px;
    width: 100%;
    background: #fff;
}
.nav li a{
    float: left;
    width: 80px;
    padding: 15px 0;
}
.nav li a:hover{
    color: #f33 !important;
    background: none;
}
.nav li.active a{
    color: #f55;
    text-decoration: underline;
}

在scrollspy.css。

虽然ScrollSpy功能不起作用（虽然所有CSS都可以），但我看不到我错过了什么。

你能帮我辨别一下我明显错过的东西吗？非常感谢！

更新2015-04-02：以下是我在控制台上的内容：

HTML1406: Invalid tag start: "<?". Question marks should not start tags. 
scrollspy.html, line 1 character 2
HTML1524: Invalid DOCTYPE. The shortest valid doctype is "<!DOCTYPE html>". 
scrollspy.html, line 2 character 1
SCRIPT1002: Syntax error 
bootstrap-scrollspy.js, line 1 character 1

不是那么明确 - 至少对我而言。

Answer 1

您必须引用bootstrap javascript文件（至少来自CDN）。您的脚本引用是旧的github托管文件，现在它是重定向到引导程序主页，而不是重定向到scrollspy的js文件。

官方CDN：

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

JS小提琴：http://jsfiddle.net/9AgUS/1736/

我缺少什么使ScrollSpy工作？

1 个答案: