使用下面的代码,我收到错误:$ 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")
正如我们所见,它正确加载了所有脚本:
<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>
如何解决?
最佳答案
您已将脚本放在 View 正文中,而不是放在它所属的 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>
}
此外,为了避免引用 jQuery 两次(如您的情况),请仔细检查您是否尚未将其作为 bundle 包含在 _Layout
中。
最后一点:由于默认情况下脚本包含在 DOM 的末尾,就在结束 body 标记之前,因此您不需要将脚本包装在 $(document).ready
只是因为当它执行时,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>
}
关于jquery - $ 未定义 - asp.net MVC 4,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17733509/