Question

.NET Core 2.0中的视图组件出现问题。我需要能够检测视图组件何时在父视图中完成加载。

一旦加载了视图组件，我就需要将重点放在作为视图组件一部分的特定字段上。

当前，我正在使用JQuery window.onload()。但是，在window.onload()中，视图组件和任何后续JavaScript尚未完全呈现。由于尚未完全呈现window.onload事件，因此无法在视图组件中找到特定字段。

如果我使用setTimeout并将其ms设置为1000到3000之间，从而为视图组件提供了完成加载的时间，那么它将正常工作。使用setTimeout的问题在于不一致。根据页面加载的时间长短，可能会或可能不会将焦点设置在指定字段上。

这是代码jquery代码。

var setSearchFocus = function () {
    if ($("#divSearch").is(":visible")) {
        $('#Diagnosis_Search').focus();
    }
}

window.onload = function () {
    setTimeout(setSearchFocus, 1000);
}

divSearch是呈现视图组件的父视图中的div。

Diagnosis_Search是视图组件中需要获得焦点的字段的名称。

通过其他方法来确定页面何时完全加载，或者能够检测视图组件何时完成加载，从而提供帮助。

谢谢！

Answer 1

如果您打算使用jQuery，则最好使用document ready事件：

$(document).ready(function() {
    setTimeout(setSearchFocus, 1000);
});

在整个文档/页面准备就绪之前，将触发OnLoad。使用$(document).ready(...方法将等待页面准备就绪（换句话说，当您要与之交互的DOM元素出现并呈现时）。

Answer 2

这是Web开发中最常见的问题之一。您使用的是{strong>不是 jquery的window.onload。它是文档对象模型（DOM）的一部分，并且您已经注意到它无法按预期工作。这就是@query伙计们准备好文档的原因：

$( document ).ready(function() {
   console.log( "ready!" );
});

或者只是

$(function() { console.log("ready!"); });

https://learn.jquery.com/using-jquery-core/document-ready/

UPDATE ：根据对其他答案的评论，我知道您必须等到 iframe 加载视图组件。是这样吗？如果是，则尝试收听iframe的document对象，iframe就像您网站上嵌入的另一个整个网页一样，因此还有另一个document对象。您可以使用

从父级访问此对象

document.getElementById('divSearch').contentWindow.document

您会看到一个包含其他文档的文档，这实际上是我们使用iframe所做的。请注意，如果您要在iframe上加载的文档不是来自同一原点（不是同一部分，同一网站或同一TLD），则此行将无法工作，但是正如您告诉我们的那样，这是一个viewComponent可能不是这样。

总而言之，请尝试使用$(iframe#youriframeid).ready(function() { console.log("ready!"); })。

如何判断视图组件是否已完全加载

2 个答案: