是否可以控制 HTML Razor 组件的渲染顺序？答案

【问题标题】：Is it possible to control the order in which HTML Razor components render?是否可以控制 HTML Razor 组件的渲染顺序？
【发布时间】：2019-09-18 21:05:23
【问题描述】：

我正在尝试渲染我的一个页面，并且我在要显示的 div 顶部有一个 Html.RenderAction() 调用。我想从通过我的 RenderAction 调用显示的页面内部调用document.ready() 中的我的js 初始化方法之一，但它似乎在Html.RenderAction() 调用之后的页面中的html 之前触发document.ready()。

因此，init 函数正在检查来自 kendo 元素的数据，该元素在 JQuery 完成之前被调用后尚未加载，并且仅将应为 kendo 输入的输入视为默认 html <input> 元素。

换句话说，有没有办法延迟加载/调用 RenderAction 直到页面内部加载？或者我应该只使用一些丑陋的 CSS 将我需要的部分保留在我的 div 的顶部？下面是我的代码的非常基本的摘要：

<html>
...
<div>
  @Html.RenderAction("File that calls init() method")
  <...rest of page that I need to load first, including kendo text boxes/>
</div>

</html>

调用 init() 方法的文件

<div>
...
</div>
<script src="...">
  $(document).ready(function() {
    myJs.init(params)
  }
</script>

现在我已经在其他地方实现了下面的答案，我意识到当从 document.ready 切换到 window.on('load',...) 时，它现在破坏了另一个类似工作的视图，但是 @Html.RenderAction 调用已打开底部：

...
<div>
  <>page including kendo inputs</>
  @Html.RenderAction("different file that calls same init() method")
</div>

</html>

基本上，如果剃须刀在剑道之前，document.ready 对我有效，但反之则不然 - 而window.on('load',function(){...}) 则相反。

更新：经过大量试验和错误寻找解决方案后，我最终不得不重新排列我的页面 - 似乎没有简单的方法来解决剃须刀加载的顺序CSHTML 页面

【问题讨论】：

标签： javascript c# jquery html razor

【解决方案1】：

这可能有效，请尝试使用 $(window).load(function() 而不是 $(document).ready(function()

<div>
...
</div>
<script src="...">
  $(window).load(function() {
    myJs.init(params)
  }
</script>

来自以下链接：“在完整页面完全加载时执行，包括所有框架、对象和图像”

jQuery - What are differences between $(document).ready and $(window).load?

【讨论】：

是的！那行得通，谢谢。我必须对您发布的链接中建议的内容进行的唯一更改是将$(window).load(function(){...}) 更改为$(window).on('load', function(){...})，因为该答案稍后会更新：jquery.com/upgrade-guide/3.0/…

【解决方案2】：

经过大量试验和错误寻找解决方案后，我最终不得不重新排列我的页面 - 似乎没有简单的方法可以解决剃刀在 CSHTML 页面上加载的顺序。

【讨论】：