Блокировка пользовательского интерфейса до полной загрузки страницы: плагин jquery, blockUI - PullRequest
Новая
       21

Блокировка пользовательского интерфейса до полной загрузки страницы: плагин jquery, blockUI

7 голосов
/ 30 апреля 2009

Как я могу заблокировать пользовательский интерфейс, когда страница все еще загружается, используя плагин jquery и blockUI? Если страница загружалась с использованием вызова AJAX, я знаю обходной путь, но когда страница загружается с обратной передачей, то как заблокировать пользовательский интерфейс до полной загрузки страницы?

Пожалуйста, помогите. Заранее большое спасибо за ваши усилия и время.

Ответы [ 6 ]

8 голосов
/ 30 апреля 2009

Вам нужно будет запустить плагин blockUI, как только будет выведен тег body.

Вместо традиционного: 

<script type="text/javascript">
  $(function (){
    $("body").blockUI(options);
  });
</script>

Вам нужно будет забыть о включении $(function (){}) или $(document).ready(function (){}), чтобы ваш скрипт запускался немедленно: 

<script type="text/javascript">
  $("body").blockUI(options);
</script>
4 голосов
/ 04 декабря 2010

Опираясь на и исправляя ответ Себа. Если вы блокируете пользовательский интерфейс, используйте .blockUI (), а при нацеливании на объект используйте .block (). Я не верю, что вам нужно нацеливать тело, по сути это то, что делает функция blockUI самостоятельно. Вам НЕОБХОДИМО вызывать функцию после тега body ... в противном случае тега <body> нет. Если вы действительно хотите, чтобы пользовательский интерфейс был заблокирован до загрузки каждого изображения, посмотрите последнюю строку. Если вы хотите, чтобы содержимое страницы загружалось, вы можете поставить функцию разблокировки внизу вашего знакомого $(document).ready(function().

<script type="text/javascript">  
$("body").block(options);   
//--or--  
$.blockUI(options);  
</script>

<script type="text/javascript">   
$(document).ready(function() {  
   $(window).load(function() { $.unblockUI(); }); //load everything including images.  
//--or--  
   $.unblockUI(); //only make sure the document is full loaded, including scripts.  
});  
</script>
0 голосов
/ 03 июня 2015

Полный код, который наконец-то сработал для меня, следующий: 

$("body").block({ message: '<h2>Loading...</h2>' });

$(document).ready(function () {
     $("body").unblock();
});
0 голосов
/ 04 августа 2010

Вы пробовали это? 

<script type="text/javascript">
    $(document).ready(function () {
        $.blockUI(options);
    });
</script>
0 голосов
/ 26 июля 2010

Проблема заключается в ссылках на файлы javascript.

Если на страницах ASP.NET Ajax необходимо добавить блочный пользовательский интерфейс, попробуйте включить файлы JavaScript в ScriptManager.

0 голосов
/ 30 апреля 2009

Вы можете попробовать запустить страницу со всеми отключенными компонентами, а затем включить их в событии PageLoad. Другая идея состоит в том, чтобы поместить класс CSS, который скрывает всю страницу и изменяет это при загрузке с помощью JQuery.

...