突然 JavaScript/jQuery 停止工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17722481/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Suddenly JavaScript/jQuery stopped working
提问by Stuti Rastogi
My site was working extremely fine with jQuery Ui and all but suddenly I changed a color and it stopped! Any hints why this happened? I tried writing the JavaScript in the HTML file itself as well as linking as a separate .js file. Both did not seem to work.
我的网站使用 jQuery Ui 运行得非常好，但突然间我改变了一种颜色，它停止了！任何提示为什么会发生这种情况？我尝试在 HTML 文件本身中编写 JavaScript 以及作为单独的 .js 文件进行链接。两者似乎都不起作用。
MY HTML :
我的 HTML ：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Spree 2014 | BITS - Pilani, K. K. Birla Goa Campus Sports Festival</title>
<link rel="stylesheet" type="text/css" href="teaser.css" />
<LINK REL="SHORTCUT ICON" HREF="http://s9.postimg.org/jtx29pdbf/bits.png" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script type="text/javascript" src="teaser.js"></script>
</head>
<body>
<div id="sidebar">
<img src = "images/arrow.png" alt = "Click to open" id = "arrow">
</div>
<div id ="gallery" class = "hidden"><div class="text">Gallery</div></div>
<div id = "lookback" class = "hidden"><div class="text">Lookback</div></div>
<div id = "timer" class = "hidden"><div class="text">Timer</div></div>
<div id="social">
<a href="https://www.facebook.com/bitsspree?fref=ts"><img src="images/fb.png" alt = "Contact us on Facebook" id = "fb"></a>
<a href="https://twitter.com/bitsspree"><img src="images/twitter.png" alt = "Stay tuned on twitter" id = "twitter"></a>
</div>
<div id="tabs">
<ul>
<li><a href="">About</a></li>
<li><a href="">Sponsors</a></li>
<li><a href="">Contact</a></li>
<li><a href="">Subscribe</a></li>
</ul>
</div>
<div>
<div id="logo">
<img src="images/spreelogo.png" alt="Spree Pure Sport | Run | Rise | Reach"></img>
</div>
<div id="bits">
<img src="images/bits.png" alt="Spree Pure Sport | Run | Rise | Reach"></img>
</div>
<div id="man">
<img src="images/runningman.png" alt="Spree Pure Sport | Run | Rise | Reach"></img>
</div>
</body>
MY JS FILE:
我的 JS 文件：
$(document).ready(function(){
$("#bits").hide();
$("#lookback").hide();
$("#timer").hide();
$("#arrow").click(function(){
$("#sidebar").hide();
$("#gallery").show( "fold", 2000 );
$("#lookback").show( "fold", 2000 );
$("#timer").show( "fold", 2000 );
});
});
回答by jalynn2
Problems like this can generally be easily solved using developer tools in the browser. My favorite is Firebug in Firefox, but each of the modern browsers has the capabilities you need.
像这样的问题通常可以使用浏览器中的开发人员工具轻松解决。我最喜欢的是 Firefox 中的 Firebug，但每种现代浏览器都有您需要的功能。
This is likely caused by either a file not being found, or a JavaScript error. Enable debugging and load your page. Look at the network record for a 404, and at the console for a JS error. You can also examine your HTML to see if the DOM model is as you expect it to be. You can set a break point in your script to see if the code is being reached -- if not work your way backwards up the call stack to see where the logic is wrong, and step through the code.
这可能是由找不到文件或 JavaScript 错误引起的。启用调试并加载您的页面。查看网络记录是否为 404，在控制台查看 JS 错误。您还可以检查 HTML 以查看 DOM 模型是否符合您的预期。您可以在脚本中设置一个断点以查看是否正在到达代码——如果没有，则向后返回调用堆栈以查看逻辑错误的位置，并逐步执行代码。
If you can practice these skills, you can solve the vast majority of your bugs without needing help from others.
如果你能练习这些技能，你就可以在不需要别人帮助的情况下解决绝大多数的错误。
回答by Toiletduck
Your script tag importing jquery is missing an "http:" before the URL. That would break your Jquery-ui.
导入 jquery 的脚本标记在 URL 之前缺少“http:”。那会破坏你的 Jquery-ui。
Change it to:
将其更改为：
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
回答by Hemant_Negi
The code seems fine. Check your links properly; also if they are accessible from your browser.
代码看起来不错。正确检查您的链接；也可以从您的浏览器访问它们。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script type="text/javascript" src="teaser.js"></script>
