1

クリックするとPHPフォームを送信するHTML入力ボタンがあります。そのためのコードは次のとおりです。

<input class="rg_btn" name="submit" value="Register" type="submit" />

ただし、ユーザーがそのボタンをクリックすると、ページの中央に読み込み中の画像 (gif ファイルがあります) を 3 秒間表示してから、フォームを実際に処理する必要があります。

どうすればいいですか？

[今すぐ購入] をクリックしたときのhttp://www.mega.co.nz/#proのように

4

4 に答える 4

1

最初に画像を html に追加し、CSS を使用して非表示にします。

 <img src="3sec.gif" id="gif" style="display: none;">

次に、jQuery を使用します。

 $('.rg_btn').submit(function() {
     $('#gif').show(); 
     return true;
 });

また、jQuery を持っていない場合は、ヘッダー タグの間に含めることを忘れないでください。

 <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
于 2013-10-16T18:05:08.883 に答える
0

以下のようなことができます-

ステップ 1: 送信ボタンを作成しないで、標準のボタンを作成する ステップ 2: ユーザーがボタンをクリックすると、関数を呼び出して、submitme という名前を付けます

ステップ 3:

Javascriptの場合: function submitme() { //画像を所要時間表示するコード //画像を非表示にしてフォームを送信 }

于 2013-10-16T18:05:33.540 に答える
0 
<input class="rg_btn" name="submit" value="Register" type="submit" onclick='btnClick' />


function btnClick() {

    var Gif = document.createElement('div');

    Gif.className = "?";

    Gif.innerHTML = "<img src='some_img' />";

    document.appendChild(Gif);


    setTimeout("btnClickfade()", 3000);

}

function btnClickfade() {

     document.removeChild(document.getElementByClassName("?"));

}
于 2013-10-16T18:03:15.520 に答える
0

このためには、 event.preventDefault();を使用して、(フォームを送信するための) デフォルトの動作をキャンセルするボタンの onclick を起動する関数を作成する必要があります。その後、基本的にボディに div を追加し、(CSS を介して) 3 秒間表示される中央の読み込み gif を設定します。DIV を事前に挿入することもできるため、もう追加する必要はありません。

私が理解していないことがいくつかあります。あなたの質問から、読み込み中の gif を 3 秒間表示したいことがわかります。これは非常に長く、その後で実際にフォームの処理を開始したいと考えています。

この場合、AJAX を使用してリクエストを透過的に処理することを強くお勧めします。たとえば、ページのリロードがなく、送信時に 3 秒の遅延がありません。

また、ユーザーが JS を無効にしている場合は、フォームが即座に送信される PHP フォールバックを使用できます (ユーザーは 3 秒も待ちたくないでしょう)。

これはおそらく最もユーザーフレンドリーな方法です。プレーン JS で AJAX リクエストを実装する方法について質問がある場合は、この質問にコメントしてください。必要に応じて編集します。

‐ シド

于 2013-10-16T18:07:43.347 に答える