Многие объяснения уже присутствуют, чтобы объяснить, как это происходит и как это исправить, но вы также должны следовать рекомендациям, чтобы избежать NullPointerException
вообще.
См. также: A хороший список лучших практик
Я бы добавил, очень важно, хорошо использовать модификатор final
. Использование "окончательной" модификатор, когда это применимо в Java
Сводка:
final
для обеспечения хорошей инициализации. @NotNull
и @Nullable
if("knownObject".equals(unknownObject)
valueOf()
поверх toString (). StringUtils
StringUtils.isEmpty(null)
. Вы можете запретить отправку формы с помощью
$("#prospects_form").submit(function(e) {
e.preventDefault();
});
. Конечно, в функции вы можете проверить пустые поля, и если что-то не выглядит правильным, e.preventDefault()
остановит представить.
Большинство людей не смогут подавать форму, вызывая функцию event.preventDefault()
.
Еще одно средство - удалить атрибут onclick кнопки и получить код в processForm()
в .submit(function() {
, поскольку return false;
заставляет форму не отправлять. Кроме того, заставить функции formBlaSubmit()
возвращать Boolean на основе действительности, для использования в processForm();
katsh
ответ один и тот же, просто легче переварить.
(Кстати, я новичок в stackoverflow, дайте мне указания, пожалуйста.)
return false;
также останавливает событие от пузырьков DOM - это сокращение для event.preventDefault(); event.stopPropagation();
– Terry
18 October 2013 в 17:51
<div id="loginForm">
<ul class="sign-in-form">
<li><input type="text" name="username"/></li>
<li><input type="password" name="password"/></li>
<li>
<input type="submit" onclick="loginForm()" value="click" />
</li>
</ul>
</div>
<script>
function loginForm() {
document.getElementById("loginForm").click();
}
</script>
В чистом Javascript используйте: e.preventDefault()
e.preventDefault()
используется в jquery, но работает в javascript.
document.querySelector(".buttonclick").addEventListener("click",
function(e){
//some code
e.preventDefault();
})
Эта проблема становится более сложной, когда вы даете пользователю 2 возможности отправить форму:
В таком случае вам понадобится функция, которая обнаруживает нажатую клавишу, в которой вы отправите форму, если была нажата клавиша Enter.
И теперь возникает проблема с IE (в любом случае версия 11) Примечание. Эта проблема не существует с Chrome и с FireFox!
Несмотря на то, что решение выглядит тривиально, для решения этой проблемы потребовалось много часов, поэтому я надеюсь, что это может быть полезно для других людей. Это решение было успешно проверено, в частности, на IE (v 11.0.9600.18426), FF (v 40.03) & amp; Chrome (v 53.02785.143 m 64 бит)
Исходный код HTML & amp; js находятся в фрагменте. Там описан принцип. Предупреждение:
Вы не можете протестировать его в фрагменте, потому что пост-действие не определено и нажатие клавиши Enter может вмешиваться в stackoverflow.
blockquote>Если вы столкнулся с этой проблемой, а затем просто скопировал / вставил js-код в вашу среду и адаптировал его к вашему контексту.
/* * inForm points to the form */ var inForm = document.getElementById('idGetUserFrm'); /* * IE submits the form twice * To avoid this the boolean isSumbitted is: * 1) initialized to false when the form is displayed 4 the first time * Remark: it is not the same event as "body load" */ var isSumbitted = false; function checkEnter(e) { if (e && e.keyCode == 13) { inForm.submit(); /* * 2) set to true after the form submission was invoked */ isSumbitted = true; } } function onSubmit () { if (isSumbitted) { /* * 3) reset to false after the form submission executed */ isSumbitted = false; return false; } }
<!DOCTYPE html> <html> <body> <form id="idGetUserFrm" method="post" action="servletOrSomePhp" onsubmit="return onSubmit()"> First name:<br> <input type="text" name="firstname" value="Mickey"> <input type="submit" value="Submit"> </form> </body> </html>
Просто введите return следующим образом:
function validate()
{
var username=document.getElementById('username').value;
if(username=="")
{
return false;
}
if(username.length<5&&username.length<15)
{
alert("Length should between 5 to 15 characters");
return false;
}
return true;
}
body{
padding: 0px;
margin:0px;
}
input{
display: block;
margin-bottom:10px;
height:25px;
width:200px;
}
input[type="submit"]{
margin:auto;
}
label{
display:block;
margin-bottom:10px;
}
form{
width:500px;
height:500px;
border:1px solid green;
padding:10px;
margin:auto;
top:0;
bottom:0;
left:0;
right:0;
position:absolute;
}
.labels{
width: 35%;
box-sizing:border-box;
display: inline-block;
}
.inputs{
width: 63%;
box-sizing:border-box;
padding:10px;
display: inline-block;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>FORM VALIDATION</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<form action="#">
<div class="labels">
<label>Name</label>
<label>Email</label>
</div>
<div class="inputs">
<input type="text" name="username" id="username" required>
<input type="text" name="email" id="email" required>
</div>
<input type="submit" value="submit" onclick="return validate();">
</form>
</body>
</html>
Вернуть true и false из validate (); функция согласно требованию
Если вы хотите использовать Pure Javascript, следующий фрагмент будет лучше, чем что-либо еще.
Предположим :
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Form Without Submiting With Pure JS</title>
<script type="text/javascript">
window.onload = function(){
/**
* Just Make sure to return false so that your request will not go the server script
*/
document.getElementById('simple_form').onsubmit = function(){
// After doing your logic that you want to do
return false
}
}
</script>
</head>
<body>
</body>
</html>
<form id="simple_form" method="post">
<!-- Your Inputs will go here -->
<input type="submit" value="Submit Me!!" />
</form>
Надеюсь, это сработает для вас !!
Вы можете использовать этот код для отправки формы без обновления страницы. Я сделал это в своем проекте.
$(function () {
$('#myFormName').on('submit',function (e) {
$.ajax({
type: 'post',
url: 'myPageName.php',
data: $('#myFormName').serialize(),
success: function () {
alert("Email has been sent!");
}
});
e.preventDefault();
});
});
Лично мне нравится проверять форму на submit и, если есть ошибки, просто верните false.
$('form').submit(function() {
var error;
if ( !$('input').val() ) {
error = true
}
if (error) {
alert('there are errors')
return false
}
});
Добавьте этот код onsubmit = "return false":
<form name="formname" onsubmit="return false">
Это исправило это для меня. Он все равно будет запускать функцию onClick, которую вы укажете
Заменить тип кнопки на button
:
<button type="button">My Cool Button</button>
function ajax_form(selector, obj)
{
var form = document.querySelectorAll(selector);
if(obj)
{
var before = obj.before ? obj.before : function(){return true;};
var $success = obj.success ? obj.success: function(){return true;};
for (var i = 0; i < form.length; i++)
{
var url = form[i].hasAttribute('action') ? form[i].getAttribute('action') : window.location;
var $form = form[i];
form[i].submit = function()
{
var xhttp = new XMLHttpRequest();
xhttp.open("POST", url, true);
var FD = new FormData($form);
/** prevent submiting twice */
if($form.disable === true)
return this;
$form.disable = true;
if(before() === false)
return;
xhttp.addEventListener('load', function()
{
$form.disable = false;
return $success(JSON.parse(this.response));
});
xhttp.send(FD);
}
}
}
return form;
}
Не проверял, как это работает. Вы также можете привязать (это), чтобы он работал как jquery ajaxForm
, используя его как:
ajax_form('form',
{
before: function()
{
alert('submiting form');
// if return false form shouldn't be submitted
},
success:function(data)
{
console.log(data)
}
}
)[0].submit();
он возвращает узлы, чтобы вы могли сделать что-то вроде submit i выше примера
до сих пор не совершенствуется, но предполагается, что вы должны работать, вы должны добавить обработку ошибок или удалить условие отключения
var form = document.getElementById("myForm"); function handleForm(event) { event.preventDefault(); } form.addEventListener('submit', handleForm);
И я понятия не имею, как правильно отформатировать комментарий. – Tynach 6 December 2016 в 22:40event.preventDefault();
в код обработки отправки формы. Однострочный вариант того, что я добавил в мой другой комментарий (в основном такой же, как версия jQuery), будет:document.getElementById("prospects_form").addEventListener('submit', function(event){event.preventDefault();});
Возможно, есть способ сделать это короче (не используяaddEventListener()
, но кажется, что это способы о чем-то вообще не одобряется. – Tynach 6 December 2016 в 23:03