2

バックグラウンドで単一のファイル*をアップロードする方法を見つけたかったのですが、ファイルの選択後に自動的に開始し、フラッシュアップローダーを必要としないため、2つの優れたメカニズム (jQuery.Form と JQuery MultiFile) を一緒に使用しようとしています。 . 私は成功していませんが、基本的な何かが欠けているためだと確信しています。

MultiFile を使用するだけで、次のようにフォームを定義します...

<form id="photoForm" action="image.php" method="post" enctype="multipart/form-data">

ファイル入力ボタンは次のように定義されています...

<input id="photoButton" "name="sourceFile" class="photoButton max-1 accept-jpg" type="file">

そしてJavascriptは...

$('#photoButton').MultiFile({
    afterFileSelect: function(){
         document.getElementById("photoForm").submit();
    }
});

これは完全に機能します。ユーザーが 1 つのファイルを選択するとすぐに、MultiFile はフォームをサーバーに送信します。

上記のように MultiFile を使用する代わりに、次のように定義された JQuery フォーム プラグインとともに [送信] ボタンを含めるとします...

 var options = {
  success: respondToUpload
 }; 

 $('#photoForm').ajaxForm(options);

...これも完璧に機能します。[送信] ボタンをクリックすると、フォームがバックグラウンドでアップロードされます。

どうすればよいかわからないのは、これら2つを連携させることです。Javascript を使用してフォームを送信すると (上記の MultiFile の例に示すように)、フォームは送信されますが、JQuery.Form 関数は呼び出されないため、フォームはバックグラウンドで送信されません。

フォーム登録を次のように変更する必要があるのではないかと思いました...

$('#photoForm').submit(function() {
 $('#photoForm').ajaxForm(options);
});

...しかし、それは問題を解決しませんでした。.ajaxForm の代わりに .ajaxSubmit を試した場合も同様です。

私は何が欠けていますか？

  • ところで: 単一ファイルのアップロードに MultiFile を使用するのは奇妙に聞こえるかもしれませんが、ファイルの数はユーザーのアカウントに基づいて動的になるという考えです。というわけで、1個から始めましたが、条件によって個数は変わります。
4

1 に答える 1

1

答えは恥ずかしいほど単純であることがわかりました。

プログラムで送信する代わりに...

document.getElementById("photoForm").submit();

...使用しました...

$("#photoForm").submit();

また、たまに複数のファイルをアップロードするだけでよいので、もっと簡単なテクニックを使いました...

1）フォームは私のオリジナルと同じです...

<form id="photoForm" action="image.php" method="post" enctype="multipart/form-data">

2）ファイル入力フィールドは基本的に同じです...

<input id="photoFile" "name="sourceFile" style="cursor:pointer;" type="file">

3）ファイル入力フィールドが変更されると、送信が実行されます。

$("#photoFile").change(function() {
    $("#photoForm").submit();
});

4）AjaxFormリスナーはそのことを行います...

var options = {
    success: respondToUpload
}; 
$('#photoForm').ajaxForm(options);
于 2010-04-03T16:19:46.277 に答える