jQuery 不适用于淡出
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20732610/
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
jQuery not working for fadeOut
提问by Alex
I got this code for testing purpose, it's very simple , when I open it in Firefox for debugging, it's not working, everything appears to be loaded and fine, it's very weird, any thoughts on this? . many thanks
我得到这段代码用于测试目的，它非常简单，当我在 Firefox 中打开它进行调试时，它不起作用，一切似乎都已加载并且很好，这很奇怪，对此有什么想法吗？. 非常感谢
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Hover Over effect jQuery</title>
<link rel="stylesheet" href="css/style.css">
<script type="text/javscript" src="js/jquery-1.10.2.min.js">
jQuery(document).ready(function($) {
$("img").click(function(event) {
$(this).fadeOut('slow');
});
});
</script>
</head>
<body>
<div class="viewport">
<a href="#">
<img src="images/renew.jpg">
</a>
<div class="caption"><span>Caption goes here</span>
</div>
</div>
</body>
</html>回答by Tim Seguine
Change this:
改变这个：
<script type="text/javscript" src="js/jquery-1.10.2.min.js">
jQuery(document).ready(function($) {
$("img").click(function(event) {
$(this).fadeOut('slow');
});
});
</script>
To this:
对此：
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$("img").click(function(event) {
$(this).fadeOut('slow');
});
});
</script>
When you load an external script using the srcattribute, the browser will ignore the contents of the <script>tag if the request is successful. The solution is easy, just add another script tag.
当您使用该src属性加载外部脚本时，<script>如果请求成功，浏览器将忽略标记的内容。解决方案很简单，只需添加另一个脚本标签。
You should also remove the <html>that is before your <!DOCTYPE html>. It is pointless and wrong. Also, ifthis is the entire document, you need a </html>at the very end.
你也应该删除<html>这是你之前<!DOCTYPE html>。这是毫无意义和错误的。另外，如果这是整个文档，则</html>在最后需要一个。
回答by Mark
There are two problems with why the code isn't working.
代码不工作的原因有两个问题。
- When you try to load an external script using the src attribute it will ignore the contents of the script tag. Just include
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>instead :). - You misspelt JavaScript when you created the script element. Amend the spelling mistake and it will fix the code after you've correctly included the jQuery library.
- 当您尝试使用 src 属性加载外部脚本时，它将忽略脚本标记的内容。只需包括
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>:)。 - 您在创建脚本元素时拼错了 JavaScript。修改拼写错误，它会在您正确包含 jQuery 库后修复代码。
A couple more helpful tips:
一些更有用的提示：
Make sure your html tags are in the correct place. In your code, you've declared the html tag twice. Make sure you have a
<html>at the top and a closing tag</html>at the end.The
<!DOCTYPE>declaration is situated at the very top of the document.
确保您的 html 标签位于正确的位置。在您的代码中，您已经两次声明了 html 标签。确保
<html>顶部有一个，最后有一个结束标签</html>。该
<!DOCTYPE>声明是位于最顶端的文件。
Example using your code:
使用您的代码的示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Hover Over effect jQuery</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$("img").click(function(event) {
$(this).fadeOut('slow');
});
});
</script>
</head>
<body>
<div class="viewport"><a href="#">
<img src="robin.gif" ></a>
<div class="caption"><span>Caption goes here</span></div></div>
</body>
</html>
I hope this helps!
我希望这有帮助！
回答by Andrey Zhilyakov
You are probably using a slim build get the production version. here
您可能正在使用精简版来获取生产版本。这里
You can also use the slim build, which excludes the ajax and effects modules:
Download the compressed, production jQuery 3.3.1 slim build
Download the uncompressed, development jQuery 3.3.1 slim build
您还可以使用精简版，它不包括 ajax 和效果模块：
下载压缩的生产 jQuery 3.3.1 slim build
下载未压缩的开发 jQuery 3.3.1 slim build
