javascriptを使用してdrag and drop'dファイルアイコンを取得する

Question

ユーザーが何らかの種類のdivにドラッグアンドドロップしたときにアイコンのイメージを取得したいが、ユーザーに表示されている内容を正確に表示する（サムネイル、 .ico）そうすることは可能でしょうか、誰かが似たようなことをするプロジェクトを知っていますか？

ありがとうございました。あなたはHTML5のドラッグを使用している場合

Answer 1

私はミックスを示唆している：この偉大なドラッグ

をアップロードライブラリをドロップ： http://valums.com/ajax-upload/

彼らはあなたが持っているでしょう How to upload preview image before upload through JavaScript

をアップロードする前にアップロードされた画像をプレビューするにはこのJavaScriptコードをValumのアップローダーにリスナーを追加してアップロードされているファイルを取得し、2番目のリンクのコードを使用して表示します。

簡単な作業ではありませんJavaScriptを介してローカルの画像パスを取得...と行うことができること、ほとんどのブラウザをサポートすることになりながらも、最悪のこと...

になり、あなたの問題を解決する簡単な方法サーバー上の一時的な場所にイメージをアップロードし、その一時的なパスを返し、アップロードされたばかりのイメージを表示します。次に、ユーザーがアップロードしたものが好きで、一時イメージを削除すると、アップロードされたイメージを実際のパスに保存する2番目の「Keep」と「Discard」ボタンを追加します。あなたの画像は.icoなので、私はそれらが本当に大きなファイルではないと思うので、アップロードがかなり速く、そのテクニックを使って "プレビュー"も速くなるでしょう。

すべての時間は、アップロードが本当にあなたのツールを使用してユーザーの体験を向上させる前に、ユーザにプレビューを表示するようにコードを微調整に投資している場合は、自分自身に問う必要があります！

Answer 2

あなたがブラウザで表示できる形式ファイルにICOファイルを変換するためのいくつかの余分な作業を必要とするかもしれない（例えば、JPEG、PNGを。）

• ドラッグしてブラウザに画像をドロップが可能であり、ドロップAPI。 （https://developer.mozilla.org/en/DragDrop/Drag_and_Drop,http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api-tutorial/）。
• ユーザー入力をキャプチャした後、イメージをサーバーにアップロードできます。その後、あなたが望むものをイメージに変換することができます。最後に、画像をユーザーに表示することができます。

Answer 3

ここでは、多くの問題を解決するのに役立つ素晴らしいチュートリアルです。私があなたの問題を正しく理解していれば。 http://www.elated.com/articles/drag-and-drop-with-jquery-your-essential-guide/

Answer 4

html5を使用したいかどうかわかりませんが、jQueryを使用するとそのことができると思います。このURLを私を見つけた：http://decafbad.com/2009/07/drag-and-drop/api-demos.html#data_transfer

ここでは、多分これはあなたに役立つことができ、「ドラッグフィードバックイメージを使用」しました:)