2012-02-07 18 views
7

Javascriptを使用してフォームのデータを送信しようとしています。ここにhtmlがあります。onsubmit refresh htmlフォーム

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

post()関数のJavascriptは次のとおりです。

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

あなたが実際にあなたのインラインDOM-0ハンドラからfalseを返す必要があります。あなたのDOMの準備ができている安全な場所から次に

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

:だから

onsubmit = "return post();"> 

それとも、あなたのフォームにIDを与え、これを行うことができますに

onsubmit = "post();"> 

を変更:

document.getElementById("form1").onsubmit = post; 
あなたが jQueryタグを追加しているので
2

が、これはこれを行うための最善の方法それ:
控えめなイベントはそれがあるべきあなたのように

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

を添付し、

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

DOMからjsを外してください。

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

はJQuery:この記事はjQueryを使ってタグ付けされているので

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

は、私は以下のソリューションを提供します:

$('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 function here]を実行します(http://stackoverflow.com/questions/7867441/form-keyvalue-pairs-jquery-plugin#answer -7867459)に送信してください。 –

関連する問題