web-dev-qa-db-ja.com

HTMLフォームを送信し、JavaScript機能を実行します（アラートしてからリダイレクト）

「onClick」メソッドを介して呼び出すと非常に機能するJavaScript関数があります。基本的には、htmlフォームからデータを取得し、そのデータに基づいて別のページにリダイレクトします。

ただし、「Enter」ボタンを押してフォームを送信するか、JavaScript関数を呼び出すと、onClickボタンを使用してJavaScript関数を呼び出すのではなく、期待どおりに応答しません。

ユーザーがキーボードのエンターボタンを押すと、ページごとに「進行ボタン」をクリックするのと同じことが起こります（onClick経由で関数を呼び出します）

ここに私のコードがあります：

JS関数：

function completeAndRedirect(){
    alert('You\'re nearly there! To complete your entry, you simply need to tap \'continue\' on the next page. Good luck!');
    location.href='http://google.com/?SID='+'<? echo $CATEGORY; ?>'+','+'<? echo $PLATFORM; ?>'+','+'<? echo $DEVICE; ?>'+'&email='+document.forms[0].elements[0].value;
}

フォームは次のとおりです。

<form action="" method="post" onsubmit="completeAndRedirect()">
    <input type="text" id="Edit1" style="width:280; height:50; font-family:'Lucida Sans Unicode', 'Lucida Grande', sans-serif; font-size:22px">
</form>

手伝ってくれる人に感謝します！

javascripthtmlformssubmit
18
Harry
<form action="javascript:completeAndRedirect();">
    <input type="text" id="Edit1" 
    style="width:280; height:50; font-family:'Lucida Sans Unicode', 'Lucida Grande', sans-serif; font-size:22px">
</form>

関数を指すようにアクションを変更すると、別の方法で問題が解決します。

57
user1621465

デフォルトの動作を防ぐ必要があります。 e.preventDefault()またはreturn false;のいずれかを使用できます。この場合、最良の方法は、ここでreturn false;を使用できることです。

<form onsubmit="completeAndRedirect(); return false;">
10
Praveen Kumar Purushothaman

デフォルトの動作であるフォームが送信されているように見えますが、これで停止できます：

<form action="" method="post" onsubmit="completeAndRedirect();return false;">
1
Ibu