2

これはかなりエレメンタリーに聞こえますが、ブラウザのデフォルトのファイル入力ボックス(「ファイルを選択...」と表示され、参照)要素を非表示にし、代わりにボタンを介してダイアログをトリガーするBlueimp jQueryFileUploadのコード例が見つかりません。 。誰かがこれを行う方法を教えてもらえますか?

このデモに示すように、入力要素をボタン要素内に配置しようとしましたが、Firefoxでは機能しません。jQueryを使用してダイアログをトリガーする方法はありますか?「参照」ボタンがChromeのボタンと一致しているが、FFでは一致していないことを除いて、これがChromeで機能する理由はよくわかりません。

これが私が本質的にやろうとしていることです:

<button id="upload-button" class="btn btn-primary btn-large" type="button"> <input type="file" name="image" id="fileupload" multiple data-url=""/> Upload Images
</button><br>

4

3 に答える 3

5

プラグインのデモ ページのように、ボタン要素をスパンに変更します (ボタンのようにスタイルを設定します) 。

于 2013-11-14T23:58:21.183 に答える
2

ここでいくつか質問しているようですので、それらに対処してみます。

  1. hidden default input -ここのサンプル ページでは、彼の CSS がデフォルトのファイル入力要素を非表示にしていることがわかります。

    .fileinput-button input { cursor: pointer; direction: ltr; font-size: 23px; margin: 0; opacity: 0; position: absolute; right: 0; top: 0; transform: translate(-300px, 0px) scale(4); }

  2. トリガー方法 - これを行うには、少なくとも 2 つの方法があります。

    2.1基本的なインスタンス化は次のようになります:$('#fileupload').fileupload();

    2.2 別のイベント (この場合は変更イベント) にバインドすることによる実用的な方法:

    $('#some-file-input-field').bind('change', function (e) { $('#fileupload').fileupload('add', { fileInput: $(this) }); });

    その例はAPIにもあります

于 2013-03-07T14:46:34.460 に答える