5

私は fileupload.js jquery プラグインを使用し、このチュートリアルに従ってこれを実装しました: jQuery File Upload プラグインを使用した ASP.NET Ajax ファイルのアップロード

これはうまく機能しますが、入力 (fileuplaod コントロール) を使用してファイルが選択されるとすぐに、イベントが発生し、ファイルがアップロードされます。ただし、ボタンをクリックした後にのみこれを実行しようとしています。

コードは次のとおりです。

<input id="fileupload" type="file" name="file" multiple="multiple"/>
<input id="btnSubmit" type="button" value="Start Upload"/>

    $('#fileupload').fileupload({
      //uploads file
    });

このようなことをする必要があります:

  $('#btnSubmit').click(function () {
       $('#fileupload').fileupload({
         //uploads file
       });
    });

コールバック オプションを使用してこれを行うことができると思いますが、これを適切に取得できませんでした:コールバック オプション

4

5 に答える 5

5

これを試して：

<input id="fileupload" type="file" name="file" multiple="multiple"/>

<script>
$('#fileupload').on('click', function(){
    //uploads file
});
</script>

jQueryで「on」を使用します。

ご挨拶。

于 2012-11-02T22:32:35.970 に答える
2

このプラグインに関するリンクには次のように記載されています。拡張子が正しいので、実装は次のようになります:"

if(valid)
 data.submit();

以下は次のとおりです。「別の方法として、アップロード プラグインにファイルのアップロードをすぐに開始しないように指示し、ユーザーが特定の「アップロード」ボタンを手動でクリックしたときに検証することもできます。」

したがって、この行を切り取ってdata.submit()、代わりにクリックボタンイベントハンドラーでこれを呼び出す必要があると思います。

于 2012-11-05T19:25:21.540 に答える
2

これを行うには、「追加」オプションを使用してファイルをアップロードします

マークアップで

<input id="files" type="file" name="files" multiple="multiple"/>
<input id="fileupload" type="file" name="file" multiple="multiple" style="display:none;"/>
<input id="btnSubmit" type="button" value="Start Upload"/>

JQueryで

$('#btnSubmit').click(function () {
    var inputs = $('#files'); 
    var arr = $.makeArray(inputs); // turn the jQuery objects into an array
    var filesList = $.map(arr, function (element, index) { 
        return element.files;
    });

    $('#fileupload').fileupload('add', { files: filesList }); // upload by calling 'add'
});
于 2012-10-28T08:38:35.543 に答える
1

ボタン id="buttonUpload" onclick="return ajaxFileUpload();" style="font-size: 11px"> アップロード />

img id="読み込み中" src="images/loading.gif" style="表示: なし;" /> -- 進行状況バーにします

スクリプトタグに以下を含め、要件に従って変更します

関数 ajaxFileUpload() {

        $("#loading")
.ajaxStart(function() {
    $(this).show();
})
.ajaxComplete(function() {
    $(this).hide();
});

$.ajaxFileUpload
    (
        {
            url: 'AjaxImageUploader.ashx',
            secureuri: false,
            fileElementId: 'fileToUpload',
            dataType: 'json',
            data: {},
            success: function(data, status) {

            },
            error: function(data, status, e) {
                alert(e);
            }
        }
    )

        return false;
    }
于 2012-11-06T07:38:06.293 に答える
1

これを試して：

<input id="fileupload" type="file" name="file" multiple="multiple" onClick="uploadFunction"/>

<script>
uploadFunction()
{
$('#fileupload').fileupload({
  //uploads file
});
}
</script>
于 2012-10-28T08:16:04.200 に答える