以下は、私がやっていることとその理由です。
- さまざまなスクリプトで前処理されたフォームがあります ユーザー入力による
- 通常、スクリプトは数秒で実行されますが、1つのスクリプト サーバーの負荷などによって約10秒かかる場合があります。
- ここで、次を含むこの「ポップアップ」を実装します。「お待ちください while ...」私はそのためにblockUIを使用しています-実装するためのシンプルなプラグイン この。
- ただし、ユーザーとして、高速スクリプト実行のためのblockUIは非常に愚かです 画面にポップアップが点滅するだけです。
- したがって、私はそのために1000msのようなタイムアウトを設定したいので、blockUI フォームが既に完了している場合でも表示されます
- これまで私はかなり多くのことを試してきましたが、今では基本的に preventDefaultはsetTimeoutのフォーム送信をキャンセルしますが、Im その後、フォームの送信を完了できません。
編集：javascriptは非同期言語であるため、preventDefault（フォームの送信を停止）なしでsetTimeoutは起動せず、アクションはすぐにtrueを返します。
<form method="post" name="my_form" id="my_form" enctype="multipart/form-data">
<input type="submit" name="my_submit" id="my_submit" value="Submit" />
<div id="form_loading_message" style="display:none;">
<h1>Please wait, page is loading...</h1>
</div>
</form>
$("#my_submit").click(function(event) {
$.blockUI({
message: $("#form_loading_message")
});
var form = $("#my_form");
event.preventDefault();
setTimeout(function () {
form.unbind("submit").submit();
$.unblockUI();
}, 1000);
});
あなたがこれを行う方法についてより良いアイデアをお持ちの場合は、私も他の提案を受け付けています...
回答：
回答№1は0blockUIに精通していませんが、...」
<html>
<head>
<script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#my_submit").click(function() {
$("#form_loading_message").show();
setTimeout("submitForm()", 1000);
});
});
function submitForm(){
$("#my_form").submit();
}
</script>
</head>
<body>
<form method="post" name="my_form" id="my_form" action="google.com" enctype="multipart/form-data">
<input type="button" name="my_submit" id="my_submit" value="Submit" />
<div id="form_loading_message" style="display:none;">
<h1>Please wait, page is loading...</h1>
</div>
</form>
</body>
</html>
回答№2の場合は0
私はこれを行う方法を見つけられなかったのでjavascript、ユーザーを別のページにリダイレクトする前にphp sleep（）-functionを使用しました。自然にpreventDefaultが送信アクションをブロックしたため、削除する必要がありました。このソリューションは、私にとってのユースケースを解決します。ページがロードされているというメッセージをユーザーに表示するだけです。