Представьте себе довольно стандартную страницу веб-приложения с помощью jQuery и Knockout, которая использует в основном модальные диалоги для редактирования данных. Модальные диалоги создаются с помощью jQuery UI, и все работает. Когда страница загружается, JS запускается, диалоги открываются при нажатии кнопки, выполняют свою работу, все отлично, отлично и персико.лучший способ скрыть модальные элементы при загрузке страницы
Однако, поскольку страница загружается, элементы в div s, содержащие HTML-код для модальных элементов управления, будут мигать всего лишь секунду, прежде чем скрипт перевернет их в диалоги, после чего они снова будут скрыты до тех пор, пока диалог открывается. И да, это произойдет даже тогда, когда скрипт был завернут в вызов $(document).ready(), поскольку все, что это делает, предотвращает манипуляции до тех пор, пока DOM не будет загружен.
Один из методов, который, кажется, уходит, состоит в том, чтобы добавить visibility: hidden; в CSS класса, который я присваиваю своему модальному div, который останавливает форму элементов, появляющуюся при загрузке страницы, но затем также превращает эти элементы внутри модального управлять невидимыми, и я должен добавить следующую строку в функцию, которая открывает его ...
$modal.css('visibility', 'visible');
Опять же, все это похоже на работу, но мне интересно, если кто-нибудь знает лучший способ эффективно скрыть все входы и выпадающие списки, а также текст внутри того, что станет модальным элементом управления загрузкой страницы, чем при воспроизведении с помощью CSS при открытии диалога.
Поскольку диалоговое окно, скорее всего, изменит видимость (например, дисплей css), полезно использовать просто '#modal {display: none}' в вашем css - ее больше http://stackoverflow.com/questions/2513051/when-creating-a-dialog-with-jquery-how-do-i-hide-the-dialog-div – mplungjan
Как насчет использования только CSS и установки 'display : none' для всех диалогов, которые нужно скрывать? – DRD