Ajax 画像アップロードの強化
画像をアップロードするためにフォームを Ajax に変換しようとしていると、いくつかの障害に遭遇しました。問題を詳しく調べて解決策を提供しましょう。
問題 1: 送信イベントがアクションをトリガーしない
Ajax コードには、成功ハンドラーやエラー ハンドラーなどの重要なコンポーネントが不足しています。これらのハンドラーを含めると、サーバーからのエラーや応答をキャプチャして分析できるようになります。
問題 2: ファイル選択ではなく、送信時に関数がトリガーされる
ファイル選択時の画像アップロード機能、ファイル入力時の「変更」イベントを利用できます。変更イベントをキャプチャすると、フォームの送信を待つのではなく、ファイルの選択時に関数をすぐに実行できるようになります。
強化された Ajax コード:
これは改善されたコードです。必要な変更を組み込んだ Ajax コード:
$(document).ready(function (e) { $('#imageUploadForm').on('submit', (function (e) { e.preventDefault(); var formData = new FormData(this); $.ajax({ type: 'POST', url: $(this).attr('action'), data: formData, cache: false, contentType: false, processData: false, success: function (data) { console.log("success"); console.log(data); }, error: function (data) { console.log("error"); console.log(data); } }); })); $("#ImageBrowse").on("change", function () { $("#imageUploadForm").submit(); }); });
追加注:
サーバー側の問題を把握するために、PHP コードに適切なエラー処理が含まれていることを確認してください。
以上がAjax イメージのアップロードを強化してエラーを処理し、ファイル選択時にトリガーするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。