Как сделать сообщение о загрузке видимым после того, как пользователь нажимает кнопку Отправить в форме?

Question

Как сделать сообщение о загрузке видимым после того, как пользователь нажимает кнопку Отправить в форме?

0

У меня есть форма входа в HTML в моем приложении ASP.NET MVC, которое выглядит так:

<form action="/Account/Login" class="form" method="post">
   <input name="UserName" size="25" type="text" value="">
   <input name="Password" size="25" type="password">
   <button type="submit" class="glossy">Login</button>
</form>

<div class="loading-mask" id="authenticating">
   <span>Authenticating ...</span>
</div>

Когда пользователь нажимает кнопку "Отправить", задержка перед обработкой /Account/Login и до того, как она вернется либо с частичной формой, отображающей ошибки, либо до того, как пользователь перейдет на новую страницу.

Есть ли способ, по которому я могу сделать div div невидимым, когда появится форма, и затем она станет видимой после нажатия кнопки отправки. Обратите внимание: мне не понадобится, чтобы он снова был скрыт, так как любое действие после отправки приведет к новой загрузке страницы.

Примечание. Я ищу способ, который не использует jQuery.

Samantha J T Star 19 окт. 2013, в 16:48

Источник

0

Вы используете jQuery или просто обычный javascript?
Jack Pettinger 19 окт. 2013, в 14:44
0

Извините за мой медленный ответ. Нет моя страница не использует jQuery? Я уточню вопрос, чтобы упомянуть об этом.
Samantha J T Star 19 окт. 2013, в 14:59
0

Вы сделали попытку? Вы изучили JavaScript? Мы не просто напишем это для вас ....
Sir 19 окт. 2013, в 15:03

Показать ещё 1 комментарий

Теги:

javascript

html

1 ответ

Ещё вопросы

Вы используете jQuery или просто обычный javascript?
Извините за мой медленный ответ. Нет моя страница не использует jQuery? Я уточню вопрос, чтобы упомянуть об этом.
Вы сделали попытку? Вы изучили JavaScript? Мы не просто напишем это для вас ....

Sampriti Panda · Accepted Answer · 2013-10-19T13-03-00.000Z

Сначала установите для свойства display значение none.

#authenticating {
    display:none;
}

А затем в форме code

onsubmit="document.getElementById('authenticating').style.display = 'block'"

EDIT Как предложил Дейв, лучше использовать прослушиватели событий.

document.getElementsByClassName('form').addEventListener("submit", function(){
    document.getElementById("authenticating").style.display = "block";
}), false);

В идеале, однако, используйте прослушиватели событий поверх встроенных.