jQuery的.load().load()
我有3个局部视图jQuery的.load().load()
视图1中:
//_yard.cshtml
@model Yard
<div>@Model.Name</div>
<div class="yard"></div>
@foreach(var house in Model.Houses)
{
<script type="text/javascript">
$(document).ready(function{
$(".yard").load("/community/Houses");
});
</script>
}
视图2
//_houses.cshtml
@model House
<div>@Model.Name<div>
<div class="house"></div>
@foreach(var level in Model.levels)
{
<script type="text/JavaScript">
$(document).ready(function{
$(".house").load("/Community/Levels");
});
</script>
}
视图3:
//_levels.cshtml
@model Level
<div>@Model.Name<div>
<div class="room"></div>
@foreach(var room in Model.Rooms)
{
<script type="text/JavaScript">
$(document).ready(function{
$(".room").load("/Community/Rooms");
});
</script>
}
将上述样品,显示了我加载使用jQuery Load()
另一视图内的View 1
,我然后加载View 2
withing View 1
,然后等等,然而,第一负载()工作正常,但subsequint负载不火。
我认为这是由于$(document).ready();
函数未被重置,但是,我不确定如何在每次加载时重置它。
问题解决 使用MVC默认模板在页面底部呈现jQuery脚本。我把它移到顶端,并且ajax加载工作。
我知道这没有意义,但它解决了这个问题。为了解决这个问题,我会在做一些更多的调查之后更新这个问题。
编辑: 下面的答案一般是有益的,但我认为真正的问题是在你的JavaScript语法错误。代码行最后都有一个太多的)
。解决这个问题,请确保你没有通过检查你的浏览器的JavaScript控制台拥有更多的语法错误,那么也可以使用下面:-)
思考$(document).ready();
被“复位”的建议是无益的,因为它不是并且不能被“重置”。
这是一个事件,在第一次DOM被完全加载并准备好被JavaScript处理时被触发。事件发生一次,并且只有一次,当第一次加载网页时。任何后续的AJAX请求都不会在页面上触发新的$(document).ready();
事件。但是,他们会发起其他事件 - 但不是$(document).ready();
。
从视图2和3中删除$(document).ready();
,您的代码将起作用。 (提示:您应该将您的JavaScript包装在<script>
标签中,否则在某些浏览器中可能会出现一些奇怪的行为)。
事件当AJAX请求完成后可以帮你出火:
-
$.ajax();
有success
/error
/complete
处理程序。 -
.load();
有一个complete
处理程序。
只是删除'$(document).ready();'不会导致下一个加载执行。 '
忘记查看3现在。这是否在View 2中工作: – 2013-02-22 09:40:08
你也有一些语法错误。结尾,并且每个.load()行末尾有一个太多)。在浏览器中使用诸如JSLint或JavaScript控制台之类的工具,以确保JavaScript有效。 – 2013-02-22 09:57:56
在附注中,纯粹基于您在上面提供的示例,我认为根本不使用JavaScript更有意义。当你执行你的@foreach时,我会把Html.RenderPartial()放在那里,而不是JavaScript,并在服务器端生成整个HTML,而不是在服务器上加载部分页面,然后从多个AJAX调用加载剩下的AJAX调用客户端。 – 2013-02-22 09:08:42
我必须使用ajax加载它,随后从各种Web服务中提取数据,随后的部分需要很长时间才能加载。 – 2013-02-22 09:32:38