スクリプトがjquery replaceWithの後に動作しなくなる

Question

私はjquery postメソッドを使用して提出するフォームを持っています。そして、divの内容をajaxが返したデータで置き換えます。ここでは、コードは次のようになります。

1）私もちょうど初期値に、フォームのフィールドの値をリセットして、変更をトリガリセットボタンを使用しています：今、私はこの方法で二つの問題に直面しています

$(".filter_field").change(function() { 
     $.post("/business/feedbacks/", $("#filter_form").serialize(), 
      function(data) { 
      $('#table-content').replaceWith($('#table-content', $(data))); 
      }); 
    }); 

次のコードのようにイベント：私は、リセットボタンをクリックしたときに

 $('#filter_reset').click(function() { 
      $(':input','#filter_form') 
      .not(':button, :submit, :reset, :hidden') 
      .val('') 
      .removeAttr('checked') 
      .removeAttr('selected'); 
      $(".filter_field").trigger('change'); 

     }); 

は今、それはフォームのフィールドをリセットし、上記の変更イベントを経由して、AJAXを使用してフォームを送信します。これまでのところ良いことだが、今は変更イベントを引き起こすことができない。今ではどのフィールドをフォーム上でクリックしても、それは単にajaxを使用してフォームを送信しません。

2）＃table-content division（複数のインスタンス）にsoundmanagerプラグインがインストールされています。今度は、ajaxを送信した後、そのsoundmanagerプラグインが動作を停止します。これは、soundmanagerがreadyイベントでロードされているため、ajax submitおよびreplaceWithの後に実行されないため、動作を停止します。

これらの問題を回避するソリューションはありますか？私は新しい質問ですので、私が間違ってやっている場合は申し訳ありません、正しい方向に私を導く。ありがとうございます。

編集：$ .getScript（ "/ static/js/360player.js"）;が含まれているとわかります。それは適切に動作します。 jquery replaceWithコマンドを使用して置き換えられた要素にイベントをアタッチするメソッドはありません。 'On'イベントはまったく動作していないようです。

Edit2：間違った部門で 'on'を使用していたことが判明しました。私の悪い:(

Answer 1

あなたはまた、接続されているすべてのイベントハンドラを削除する要素を交換するとき。既存の要素と将来の要素にイベントハンドラをバインドするために委任を使用する必要があります...

$("body").on("change", ".filter_field", function() { 
    $.post("/business/feedbacks/", $("#filter_form").serialize(), 
     function(data) { 
     $('#table-content').replaceWith($('#table-content', $(data))); 
     }); 
}); 

ありません