当我单击浏览器的后退和前进按钮时，我所有动态创建的 PartialView 都会消失答案

【问题标题】：When I click back and forward Buton of browser all of my dynamically created PartialView get disappered当我单击浏览器的后退和前进按钮时，我所有动态创建的 PartialView 都会消失
【发布时间】：2021-01-06 00:27:24
【问题描述】：

我可以在我的视图中创建多个Partialviews

创建.cshtml

@model Opto.Models.Recipe

....
 
<div id="Far" class="tab-pane active card-body">
                            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
                            <div class="row form-group">
                                <div class="col">
                                    <div class="text-left" dir="ltr">
                                        <partial name="RecipeFarSighted.cshtml" Model="Model.FarSighted" />
                                    </div>
                                    <hr />
                                    <div class="text-center" dir="rtl">
                                        <div id="FarSightedBillsSection">
                                            @*FarSightedBills will be created here by javascript*@
                                        </div>
                                        <a onclick="AddBill('far')" style="cursor:pointer"><img src="~/images/Plus.png" width="25" height="25" /></a>
                                        <br /><br />
                                        @if (!Model.FarSighted.Share)
                                        {
                                            <div class="form-group row form-check">
                                                <label class="form-check-label col">
                                                    <input asp-for="FarSighted.Share" type="checkbox"> عدم دریافت عینک
                                                </label>
                                            </div>
                                        }
                                    </div>
                                </div>
                            </div>
                            <br />
                        </div>
...
@section Scripts{
        <script>
        var farIndex = 0;
        var farRealCount = 0;

function AddBill(type)
        {
                tag = "<div id='farSightedBill" + farIndex + "' ><a onclick=\"RemovePartial('far'," + farIndex + ")\" style='cursor: pointer'><img src='/images/Minus.png' width='25' height='25' /></a><h4><a onclick=\"$('#farSighted" + farIndex + "').collapse('toggle')\" style='cursor: pointer' data-target='#farSighted" + farIndex + "' id='farBillTitle" + farIndex + "' > عینک دائمی " + (farRealCount + 1) + "</a ></h4 > <br /><div class='collapse' id='farSighted" + farIndex + "'></div></div > ";
                $.get('/Glasses/DisplayFarBill?index=' + farIndex +
                            '&packFactor=' + '@(Model.FarSighted?.PackFactor)' + '&lenseCover=' + '@(Model.FarSighted?.LenseCover)',
                            function (partial) {
                                $('#FarSightedBillsSection').append(tag);
                                $('#farSighted' + farIndex).append(partial);
                                $('#farSighted' + farIndex).collapse('show');
                                //aaa(farIndex);
                                farIndex++;
                                farRealCount++
                            });
}
</script>
}

当我点击浏览器的后退按钮然后前进时，我所有的局部视图都会消失。我该如何解决这个问题？当我在控制器中提交动作方法进行验证时，其中有一些错误，当它返回查看其中没有任何部分时，我该怎么办？

【问题讨论】：

标签： asp.net-core-mvc razor-pages asp.net-mvc-partialview

【解决方案1】：

首先，后退和前进按钮用于浏览访问过的网页。它可能使用BFCache，它会缓存整个页面，包括jquery（源代码）。并且您添加的部分视图不会显示在返回之后，前进点击是因为它是jquery添加的。jquery会改变html代码，但不会改变源代码。当你点击后退，前进按钮，浏览器会重新加载源代码，并呈现为html代码。如果你想要要显示部分视图，您只能像这样在代码中直接添加它们：

<div class="text-left" dir="ltr">
       <partial name="RecipeFarSighted.cshtml" Model="Model.FarSighted" />
</div>

【讨论】：