jQuery函数在MVC局部视图中不起作用

Question

在我的局部视图中，.hide函数最初不会为第二人称和第三人称渲染，因此延迟.hide和.fadein也不起作用。我是js和jquery的新手，所以我可能缺少明显的东西...为什么此js脚本无法在部分视图中运行？

一切都在主视图中时一切正常，但是我需要部分视图是因为我不想每15秒重新加载整个页面。我已经做过一些研究，获取html数据类型可能有问题吗？

主视图：

@model IEnumerable<project.Models.MyList>

<div id="scrolllist">
    @Html.Partial("_ScrollList")
</div>

@section Scripts{
<script>
function loadScrollListPV() {
   $.ajax({
    url: "@Url.Action("ScrollList")",
    type: 'GET', // <-- make a async request by GET
    dataType: 'html', // <-- to expect an html response
    success: function(result) {
                $('#scrolllist').html(result);
             }
   });
}
$(function() {
    loadScrollListPV();
    // re-call the functions each 15 seconds
    window.setInterval("loadScrollListPV()", 15000);
});
</script>
}

控制器动作：

    public ActionResult ScrollList()
    {
        return PartialView("_ScrollList", db.MyList.ToList());
    }

部分视图：

@model IEnumerable<project.Models.MyList>


<div id="firstperson">
@*Get lastest record and display.*@
@foreach (var donor in Model.OrderByDescending(p => p.ProcessTime).Take(1))
{
}
</div>

<div id="secondperson">
@*Get second lastest record and display.*@
@foreach (var donor in Model.OrderByDescending(p => p.ProcessTime).Skip(1).Take(1))
{       
}
</div>

<div id="thirdperson">
@*Get third lastest record and display.*@
@foreach (var donor in Model.OrderByDescending(p => p.ProcessTime).Skip(2).Take(1))
{        
}
</div>

@section Scripts{
<script>
$("#secondperson").hide();
$("#thirdperson").hide();
function person() {
    $("#firstperson").delay(5000).hide(0, function () {
        $("#secondperson").fadeIn();
        $("#secondperson").delay(5000).hide(0, function () {
            $("#thirdperson").fadeIn();
            $("#thirdperson").delay(5000).hide(0, function () {
                $("#firstperson").fadeIn();
                person();
            });
        });
    });
}
</script>
}

任何帮助都将非常棒，在此先感谢您！

Answer 1

我不确定这里是否100％，但是我认为根据此答案在部分视图中呈现@script部分可能存在问题。提到默认情况下，局部视图不能使用@section元素。

尝试删除脚本部分周围的剃刀语法，然后使用：

<script type="text/javascript">
    $("#secondperson").hide();
    $("#thirdperson").hide();
    function person() {
    $("#firstperson").delay(5000).hide(0, function () {
        $("#secondperson").fadeIn();
        $("#secondperson").delay(5000).hide(0, function () {
        $("#thirdperson").fadeIn();
        $("#thirdperson").delay(5000).hide(0, function () {
            $("#firstperson").fadeIn();
            person();
        });
    });
});
}
</script>