1

私は非常に単純なhtmlフォームを持っています:

<form enctype="multipart/form-data" method="POST" action="fileupload" id="image-upload-form" target="iframe-post-form">
    <input type="file" name="file" id="file-to-upload">
    <input type="submit" value="upload" id="image-upload-submit">
</form>

Iframe Post Formライブラリを使用して画像を送信しています。

次のjqueryを使用している場合、完全に機能します。

$(document).ready(function(){
    $('#image-upload-form').iframePostForm({
        post : function() {
           $("#progress-indicator").show();
        },
        complete : function (response) {
        $("#progress-indicator").hide();
            try {
                json = $.parseJSON(response);
            } catch (e) {}
         }
     });
});

ここで、ファイルを選択した直後にページが自動的に画像を送信する必要がある一方で、送信ボタンを削除したいと思います。私はjqueryとjscriptの初心者で、些細な間違いをしているに違いありませんが、ほとんど同じコードが機能しない理由がわかりません。これが問題のあるコードです (firebug で確認できますが、そのコード内のブレークポイントがヒットしていることがわかりますが、画像は送信されていません)。

$(function() {
    $('#file-to-upload').bind('change', function(event) {
        $('#image-upload-form').iframePostForm({
            post : function() {
                $("#progress-indicator").show();
            },
            complete : function (response) {
                $("#progress-indicator").hide();
                try {
                    json = $.parseJSON(response);
                } catch (e) {}
            }
        });
   });
});

大変お世話になりました。

解決：

@Huangism の提案を受け取った後、最終的に解決策を見つけました。誰かが同じ問題を解決する必要がある場合に備えて投稿します。

$(function() {
    $('#file-to-upload').bind('change', function(event) {
        $('#image-upload-form').submit().iframePostForm({
            post : function() {
                $("#progress-indicator").show();
            },
            complete : function (response) {
               $("#progress-indicator").hide();
               try {
                   json = $.parseJSON(response);                    
               } catch (e) {}
            }
        });
    });
});
4

1 に答える 1

1

私は iframe post form lib を使用したことがありませんが、最初の作業コードは、ドキュメントの準備ができたときにリスナーを設定しているように見えます。コードでは、ファイルからアップロードへの変更機能の中に設定を入れます。したがって、基本的に、ロードするファイルが変更されるたびに、投稿フォーム全体が毎回セットアップされます。

変更時にフォームの送信機能を呼び出す必要があります。post form lib が何をするのかよくわからず、コード構造全体もわからないので、他に何か提案することはできません。しかし、コードの問題は、投稿フォームの設定を間違った場所に置いていることです

于 2012-05-17T20:48:59.340 に答える