Я новичок в jquery и хотел бы узнать, как показать сообщение (например, подождите зеленым цветом или отправьте) после нажатия кнопки отправки.
Можете ли вы помочь
3 ответа
Возможно, это поможет:
$('#submitButtonID').click(function(){
alert('Please wait while form is submitting');
$('#formID').submit();
});
Аяксификация формы не требуется. Вы можете просто показать скрытый элемент div во время отправки. Пока серверная сторона не отправила обратно ни одного бита ответа, веб-браузер будет продолжать отображать начальную страницу.
Вы можете использовать CSS display: none
, чтобы изначально скрыть элемент. Вы можете использовать jQuery.show (), чтобы показать элементы, соответствующие селектору.
<!DOCTYPE html>
<html lang="en">
<head>
<title>SO question 3377468</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function() {
$('#form').submit(function() {
$('#progress').show();
});
});
</script>
<style>
#progress {
display: none;
color: green;
}
</style>
</head>
<body>
<form id="form" action="servlet-url" method="post">
...
<input type="submit">
</form>
<div id="progress">Please wait...</div>
</body>
</html>
Итак, если вы не используете скриптлеты в JSP для выполнения тяжелых бизнес-задач, а скорее класс сервлета, который, в свою очередь, отображает JSP в конце обработки, он будет работать так, как вы ожидаете.
Обычно после нажатия кнопки submit
форма отправляется на сервер, и выполнение всех клиентских скриптов прекращается. Поэтому, если вы не AJAXify свою форму, это не сработает. Чтобы использовать AJAXify для вашей формы, вы можете присоединиться к событию submit и заменить действие по умолчанию:
$(function() {
$('#theForm').submit(function() {
// show a hidden div to indicate progression
$('#someHiddenDiv').show();
// kick off AJAX
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function() {
// AJAX request finished, handle the results and hide progress
$('#someHiddenDiv').hide();
}
});
return false;
});
});
И ваша разметка:
<form id="theForm" action="/foo" method="post">
<input name="foo" type="text" />
<input type="submit" value="Go" />
</form>
<div id="someHiddenDiv" style="display: none;">Working...</div>
Похожие вопросы
Связанные вопросы
Новые вопросы
jquery
jQuery — это библиотека JavaScript. Также рассмотрите возможность добавления тега JavaScript. jQuery — это популярная кросс-браузерная библиотека JavaScript, которая упрощает обход объектной модели документа (DOM), обработку событий, анимацию и взаимодействие AJAX, сводя к минимуму расхождения между браузерами. Вопрос с тегом jQuery должен быть связан с jQuery, поэтому jQuery должен использоваться рассматриваемым кодом, и в вопросе должны быть как минимум элементы, связанные с использованием jQuery.
.clickfunction()
? Вы имеете в виду.click(function(){