Как определить, полностью ли загружен компонент представления

Question

У меня проблема с компонентами представления. NET Core 2.0. Мне нужно быть в состоянии определить, когда компонент представления закончил загрузку в родительском представлении.

После загрузки компонента просмотра мне нужно установить фокус на поле c, которое является частью компонента просмотра.

В настоящее время я использую JQuery window.onload() , Тем не менее, в window.onload() компонент представления и любые последующие JavaScript еще не полностью отрисовали. Поскольку он не полностью отобразил событие window.onload, не может найти поле спецификаций c в компоненте представления.

Если я использую setTimeout и задаю его мс между 1000 и 3000, что дает смотреть время компонента до конечной sh загрузки, все работает нормально. Проблема с использованием setTimeout заключается в том, что он не согласован. В зависимости от того, сколько времени занимает загрузка страницы, она может или не может установить фокус на указанном поле.

Вот код jquery code.

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

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

divSearch - это div в родительском представлении, где отображается компонент представления.

Diagnosis_Search - это имя поля в компоненте представления, которое должно получить фокус. страница полностью загружена или возможность определить, когда компонент представления завершил загрузку.

Спасибо!

Answer 1

Это одна из самых распространенных проблем в веб-разработке. Вы используете window.onload, который не jquery. Это часть Document Object Model (DOM), и, как вы заметили, она не работает должным образом. Вот почему ребята @ jquery придумали готовый документ:

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

или просто

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

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

ОБНОВЛЕНИЕ : согласно комментарию к другому ответу, я получаю, что вам нужно подождать, пока iframe загрузит ваш компонент представления. Это так? Если это так, попробуйте прослушать объект iframe document, iframe похож на другую целую веб-страницу, встроенную на ваш сайт, поэтому для него есть еще один объект document. Вы можете получить доступ к этому объекту из родительского объекта, используя

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

, вы видите документ, содержащий другой документ, который фактически является тем, что мы делаем с iframe. Остерегайтесь, эта строка не будет работать, если документ, который вы загружаете в iframe, не находится в том же источнике (не является частью или той же веб-страницей, или в том же TLD), но, как вы сказали нам, это viewComponent this не тот случай, наверное.

Чтобы подвести итог, попробуйте вместо этого $(iframe#youriframeid).ready(function() { console.log("ready!"); }).

Answer 2

Если вы используете jQuery, вам лучше использовать событие готовности документа:

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

OnLoad сработает до того, как весь документ / страница будет готова. Использование подхода $(document).ready(... будет ждать, пока ваша страница не будет готова (другими словами, когда элементы DOM, с которыми вы хотите взаимодействовать, присутствуют и отображаются).