Всем привет, мы снова встретились, я ваш друг Цюаньчжаньцзюнь.
Все заметили, что когда мы нажимаем «Отправить», чтобы отправить форму, она обновляется один раз. Если вы не хотите, чтобы она обновлялась, есть два метода:
Для этого мы можем использовать скрытый iframe. Главное, чтобы мы поместили цель отправки в скрытый iframe, а затем позволили iframe отправить данные.
(ps: Это не проверялось, оно представлено только в Интернете, я запишу. Возможно, я попробую, если столкнусь с этим в будущем)
<form action="" method="post" target="the_iframe">
<input; type="text" id="id_input_text" name="the_input_text" />
<input type="submit" id="id_submit" name="the_submit" значение = «Отправить» />
</form>
<iframe id="is_iframe" name="the_iframe" style="display:none;"></iframe>
Мы также можем связать событие onsubmit (submit() в jq), мы отправляем данные до того, как сработает эффект кнопки отправки, а затем возвращаем false (на этот раз сделайте недействительным событие триггера нажатия кнопки отправки, иначе форма будет отправлена снова один раз). и обновите страницу)
Мы можем сделать это:
====== Если вы используете нативный js
HTML-код:
<form id="err_form" onsubmit="return post_data()">
<input type="text" name="contact" name="address" autofocus="autofocus" Placeholder="Ваша контактная информация?" />
<input type="text" name="title" maxlength="10" Placeholder="Аннотация в пределах 10 слов" (необязательный)" />
<textarea name="errmessage" required="required" maxlength="150" rows="7" Placeholder="Пожалуйста, введите описание проблемы (обязательно),150В словах)"></textarea>
<input type="submit" id="sub" значение = «Отправить» />
</form>
js-код:
function post_data(){
// код отправки данных ajax
// .....
return false; //Важно!
}
/* Обновлено 17 января 2018 г. */
Вот маленькая хитрость, только что обнаруженная.
Когда мы привязываем onsubmit, мы помещаем return false в вызывающую функцию после onsubmit. Таким образом, если в вашей функции возникает ошибка, выполнение не продолжится до «возврата false» в конце функции, и обновление все равно будет. явление;
Мы должны записать return false в событие привязки. По соображениям безопасности нам не нужно удалять return false из функции.
<form id="err_form" onsubmit="post_data();return false;">
/* ======================= */
====== Если вы используете jq
HTML-код:
<form id="err_form">
<input type="text" name="contact" name="address" autofocus="autofocus" Placeholder="Ваша контактная информация?" />
<input type="text" name="title" maxlength="10" Placeholder="Аннотация в пределах 10 слов" (необязательный)" />
<textarea name="errmessage" required="required" maxlength="150" rows="7" Placeholder="Пожалуйста, введите описание проблемы (обязательно),150В словах)"></textarea>
<input type="submit" id="sub" значение = «Отправить» />
</form>
js-код:
$(document).ready(function() {
$('#err_form').submit(function() { //На этот раз мы связываемся вот так
var contact = $("input[name='contact']").val();
var title = $("input[name='title']").val();
var errmessage = $("textarea[name='errmessage']").val();
var err_data = {
contact: contact,
title: title,
errmessage: errmessage
}
$.ajax({
// ajax отправить код....
});
return false; // Все равно нужно вернуться false, Та же причина, что и выше
});
});
Вот и все!
Издатель: Лидер стека программистов полного стека, укажите источник для перепечатки: https://javaforall.cn/125952.html Исходная ссылка: https://javaforall.cn