我正在尝试让我的 Javascript 在我的网站上执行，现在我已经在 HTML 中正确放置了代码，但是当我加载网页时它不会加载。
Here is the jsfiddle它工作时的样子。
Here也是在线网站，它仍然无法在页面底部看到正在运行的问题。
下面是 html 的顶部，展示了我是如何为其编写脚本的。
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>50 Project</title>
<link rel="shortcut icon" href="http://ryankerswell.co.uk/photography/wp-content/uploads/2014/11/144-iPad-App-Icon.png">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:700,300,400,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/responsive.css">
<link rel="stylesheet" href="css/case-study.css">
<link rel="stylesheet" href="css/before-and-after.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript"></script>
<script src="js/before-and-after.js" type="text/javascript"></script>
</head>
这里是使动画工作的 before-and-after.js Javascript。
var wrapper = $("div.reveal");
wrapper.mousedown(function(e) {
$(this).data("sliding", true);
var offs = e.pageX - $(this).offset().left
$(this).find('div').width(offs);
}).mousemove(function(e) {
if ($(this).data("sliding")) {
var offs = e.pageX - $(this).offset().left
$(this).find('div').width(offs);
}
});
$(document).mouseup(function(e) {
wrapper.data("sliding", false);
})
我已经和一个和我一起工作的编码员谈过，它在他的机器上工作但在我的机器上不工作，他似乎看不出它有什么问题，所以有什么地方不对吗？
此外，这段代码在 jsfiddle 上运行良好，但当我从我自己的 html 页面加载代码时却不行。
最佳答案
您忘记了结束符 ):
$(document).ready(function(e) {
alert("it's started");
}); // <-- This was just `}`
另外这个 var wrapper = $("div.reveal"); 需要在 $(document).ready 函数中，因为 DOM 没有加载元素。例如:
$(document).ready(function(e) {
alert("it's started");
wrapper = $("div.reveal");
});
它在 jsfiddle 中工作的原因是因为页面加载时执行的 JS 代码，正如我上面指出的那样，您的代码并非如此。 wrapper 仍将在 fiddle 中工作，因为代码在所有内容加载之前不会运行。
关于Javascript 不会在网站上执行？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29041909/