使用下面的代码，我得到一个错误：$没有定义。我的问题是：怎么可能？
...
<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")
我们可以看到，它正确地加载所有的脚本：
<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>
如何解决？
解决方法
您将脚本放置在视图正文中，而不是在脚本部分中，即它所属的脚本，并且在引用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>
}
另外为了避免引用jQuery两次(就像你的情况)，请仔细检查一下，如果你没有把它包含在你的_Layout中。
最后一句话：由于默认情况下脚本包含在DOM的结尾，就在关闭正文标签之前，您不需要将脚本包装在$(文档)中，只是因为在执行时DOM已经被加载了。你的代码更糟，因为你有两次。请记住$(function(){…});相当于$(document).ready(function(){…});在你的情况下，当你实际上不需要任何这些东西时，你已经嵌套了这些东西。
所以：
@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>
}
