jquery投稿の問題

Question

私はフォームを持っています。私がsubmitをクリックすると、スクリプトが実行されます。コードの

一部は次のとおりです。

 if(hasError == false) { 
     $(this).hide(); 
     $("#myForm").fadeOut("fast", function(){ 
      $("#myForm").before('<img src="../images/loading.gif" alt="Loading" id="loadingImage" />'); 
     }); 

     $.post("mail.php", 
      { emailFrom: emailFromVal, emailName: nameVal, emailMessage: messageVal }, 
       function(data){ 
        $("#loadingImage").fadeOut("fast", function() {     
         $("#loadingImage").before('<p>Your message has been sent. Cheers!</p>');            
        }); 
       } 
      ); 
    } 

フォームが送信されると、ロード画像が表示される...とまま！

ロード画像が表示され、コンソールに入力されている間、私は、Firebugのを使用する場合：

$("#loadingImage").fadeOut("fast", function() {     
         $("#loadingImage").before('<p>Your message has been sent. Cheers!</p>');   

画像が消えて、テキストが表示されます。

なぜですか？

どうもありがとう

注：電子メールが問題は、すべてのDOM要素をjQueryのメソッドにバインドされた後、あなたの新しい要素が追加されていることである

Answer 1

送信されます。動的要素は、一度ロードされるとバインドする必要があります。最も早い解決策は、あなたの最初のフェードアウトは、IMGの後に終了さ

<img src="../images/loading.gif" alt="Loading" id="loadingImage" style="display:none" /> 

Answer 2

ページのロードが作成されるときにjQueryの要素をバインドすることができますので、ページ上のHTMLを追加することです。あなたが行う必要があります。

if(hasError == false) { 
     $(this).hide(); 
     $("#myForm").fadeOut("fast", function(){ 
      $("#myForm").before('<img src="../images/loading.gif" alt="Loading" id="loadingImage" />'); 
      $.post("mail.php", { emailFrom: emailFromVal, emailName: nameVal, emailMessage: messageVal }, 
       function(data){ 
        $("#loadingImage").fadeOut("fast", function() {     
         $("#loadingImage").before('<p>Your message has been sent. Cheers!</p>');            
        }); 
       } 
      );   
     }); 
} 

をあなたが見ることができるように、我々は最初の​​コールバック関数へ$.post()呼び出しを移動しました。

これが役に立ちます。 Cheers