jQuery $ 未定义 - asp.net MVC 4
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17733509/
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
$ is not defined - asp.net MVC 4
提问by whoah
With this code below, I get an error: $ is not defined. My question is: How it is possible?
使用下面的这段代码，我收到一个错误：$ is not defined. 我的问题是：这怎么可能？
...
<script type="text/javascript">
$(document).ready(function () {
$(function () {
$('#cb').click(function () {
if (this.checked) {
$('div#div').slideDown();
} else {
$('div#div').slideUp();
}
});
})
});
</script>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
@Scripts.Render("~/Scripts/jquery-1.7.1.min.js")
@Scripts.Render("~/Scripts/jquery-ui-1.8.20.min.js")
As we can see, it load properly all of scripts:
正如我们所见，它正确加载了所有脚本：
<script src="/Scripts/jquery-1.7.1.min.js"></script>
<script src="/Scripts/jquery-ui-1.8.20.min.js"></script>
<script src="/Scripts/jquery-1.7.1.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
How to resolve it?
如何解决？
回答by Darin Dimitrov
You've placed your script in the view body and not inside the Scriptssection which is where it belongs and afterreferencing jQuery:
您放置脚本视图身体，而不是里面Scripts这是一款属于它的地方和后引用jQuery的：
@section Scripts {
@Scripts.Render("~/Scripts/jquery-1.7.1.min.js")
@Scripts.Render("~/Scripts/jquery-ui-1.8.20.min.js")
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
$(function () {
$('#cb').click(function () {
if (this.checked) {
$('div#div').slideDown();
} else {
$('div#div').slideUp();
}
});
});
</script>
}
Also to avoid having referenced jQuery twice (as in your case) double check if you haven't included it already as a bundle in your _Layout.
还要避免两次引用 jQuery（如您的情况），请仔细检查您是否尚未将其作为捆绑包包含在_Layout.
And one last remark: since by default scripts are included at the end of the DOM, just before the closing body tag, you don't need to be wrapping your script in a $(document).readysimply because by the time it executes the DOM will already be loaded. Your code is even worse because you had it twice. Bear in mind that $(function() { ... });is equivalent to $(document).ready(function() { ... });and in your case you've nested 2 of those things when you actually don't need any of them.
最后一点：由于默认情况下脚本包含在 DOM 的末尾，就在结束 body 标记之前，您不需要$(document).ready简单地将脚本包装在 a 中，因为在它执行时 DOM 已经被加载. 你的代码更糟糕，因为你有两次。请记住，这$(function() { ... });等效于$(document).ready(function() { ... });并且在您的情况下，当您实际上不需要它们时，您已经嵌套了其中的 2 个。
So:
所以：
@section Scripts {
@Scripts.Render("~/Scripts/jquery-1.7.1.min.js")
@Scripts.Render("~/Scripts/jquery-ui-1.8.20.min.js")
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
$('#cb').click(function () {
if (this.checked) {
$('div#div').slideDown();
} else {
$('div#div').slideUp();
}
});
</script>
}
回答by Nick Bork
You're not including the jQuery JS until the end of the page but you're trying to make use of $ well before you've included it.
直到页面结束，您才包括 jQuery JS，但您试图在包含它之前很好地使用 $。
回答by Chuck Conway
You are including jquery twice.
您将 jquery 包含两次。
<script src="/Scripts/jquery-1.7.1.min.js"></script>
<script src="/Scripts/jquery-ui-1.8.20.min.js"></script>
<script src="/Scripts/jquery-1.7.1.js"></script>
The first and the last js files are the same, except one is minified and the other is probably not. Remove the non-minified one and it should work for you.
第一个和最后一个 js 文件是一样的，除了一个被缩小而另一个可能不是。删除非缩小的，它应该适合你。
