1

現在、jQuery と を使用したドラッグ アンド ドロップ ソリューションがありFileReader、Chrome と Firefox で動作します。アップロードする画像のデータ URIをreadAsDataURL取得し、そのデータを PHP に POST してサーバーにファイルとして書き込みます。

コードを大幅に要約しましたが、プロセスは次のようになります。

this.bind('drop', function(evt) {
    evt.preventDefault();
    evt.stopPropagation();

    var files = evt.originalEvent.dataTransfer.files;
    var file = files[0];
    var reader = new FileReader();

    reader.readAsDataURL(file);
});

$.ajax次に、データ URI を POST するために呼び出す別の関数があります。サポートできるブラウザのチェックもありますFileReader

$.fn.initUpload = function() {
    return (window.FileReader) ? this.initDnD() : this.addClass('disabled');
}

whereinitDnD()は前の例です。

.disabledクラスについては<input type="file" />、Safari/IE に頼っています。ユーザーが選択したファイルを取得して、すぐに Safari/IE のデータ URI に変換する方法はありますか? これは、データ URI を画像として保存する PHP スクリプトを再利用したいからです。

4

0 に答える 0