2012-02-07 6 views
7

Я пытаюсь использовать Javascript для отправки данных формы. Вот html.onsubmit обновить html форму

<form onsubmit="post();"> 
//input fields here 
</form> 

Это Javascript для функции post().

var post = function() { 
alert('the form was submitted'); 
return false; 
} 

Моя проблема заключается в том, что Javascript работает, но форма все еще обрабатывает и обновляет страницу ..

Я поставил return false; код в надежде, что бы остановить форму с освежающим.

ответ

12

Вы должны поставить возвращения ложной часть после того, как функция поста() в обработчике onsubmit, например, так:

<form onsubmit="post();return false;"> 
//input fields here 
</form> 
+0

Я попытался, что и это не сработало! Но теперь он работает, спасибо! – Frank

+0

Странно, что он не работал раньше. В первый раз может возникнуть синтаксическая ошибка. Рад, что он работает, хотя, рад помочь! –

+0

'

' еще лучше, см. Мой ответ. – gdoron

2

Вы должны фактически вернуть ложь от вашего инлайн дома-0 обработчика. Меняем

onsubmit = "post();"> 

к

onsubmit = "return post();"> 

Или вы могли бы дать вашу форму идентификатор и сделать это:

<form id="form1" onsubmit = "post();"> 

Тогда из безопасного места, в котором ваш дом готов :

document.getElementById("form1").onsubmit = post; 
2

Поскольку вы добавили jQuery тега, этого лучший способ сделать это:
ненавязчивого событие придает

$('form').submit(function(){ 
     alert('the form was submitted'); 
     return false; 
    }); 

В вашем пробираться оно должно быть;

<form onsubmit="return post();"> 
6

Храните ваши js вне DOM.

<form id="myform" action="somepage.php" method="post"> 
//input fields 
</form> 

JQuery:

$('#myform').submit(function(event){ 
    alert('submitted'); 
    event.preventDefault(); 
}); 
1

Поскольку этот пост с тегами JQuery, я предлагаю следующее решение:

$('form').submit(function(e){ 
    //prevent the form from actually submitting. 
    e.preventDefault(); 
    //specify the url you want to post to. 
    //optionally, you could grab the url using $(this).attr('href'); 
    var url = "http://mysite.com/sendPostVarsHere"; 
    //construct an object to send to the server 
    //optionally, you could grab the input values of the form using $(this).serializeArray() 
    var postvars = {}; 
    //call jquery post with callback function 
    $.post(url, postvars, function(response){ 
    //do something with the response 
    console.log(response); 
    }, 'json') 
}); 
+0

Если вы решите использовать serializeArray(), назначьте его переменной и выполните функцию [Pointy's Array -> Object здесь] (http://stackoverflow.com/questions/7867441/form-keyvalue-pairs-jquery-plugin#answer -7867459) перед отправкой на сервер. –

Смежные вопросы