DIVを受け入れ、JavaScriptによるドロップを可能にしますか？

Question

私はグーグルでこれを試してきましたが、今は良くなっていますが、どこにもいません。だからここに行く：

私がしたいのは、DIVタグにテキストをドロップし、それをJavaScriptで処理することです。これらの線に沿って何か：

<script type="text/javascript"> 

function handleDrop(sender, args) 
{ 
    $('#theDiv').html(args.textfromdrop); 
} 

</script> 

<div id="theDiv" ondrop="handleDrop()" /> 

<br/> 
<p> 
This is some simple text. Draggable? 
</p> 

ので、このページにそれに応じて外観だ（または多分ちょうどそれを表示する私はdiv要素に、たとえば、段落の内容をドラッグできるようにしたいし、それがドロップを処理し、変更しますテキスト、それを扱う限り！）。私はjQueryを試してきましたが、それはまったく別のモデルだと思われ、どこからでも来ることができるはずだから、私の潜在的なdraggablesをそのように設定することはできません。これも可能ですか？

編集：私が間違っている場合は私を修正してください、これらのdroppablesはすべてそれにドロップ可能なドラッグ可能な必要がありますか？私が望むのは、あなたがコントロールしていないページからテキスト、純粋なテキストをドロップできるということです。これは奇妙に聞こえるかもしれませんが、Firefoxの拡張機能で、サイドバーにある別のページにコンテンツをドラッグできます。

Answer 1

あなたは本当にjQueryのでそれをやろうとしている場合、これは役立つはず：SO jquery-droppables-change-element-on-drop

Answer 2

私は、このようなjQueryのか、YUIとして設立JavaScriptライブラリを使用することをお勧めします。

Answer 3

それとも、私のようプロトタイプを好む場合：http://wiki.github.com/madrobby/scriptaculous/droppables

EDIT：いいえ、ユーザーが別のページに1ページからテキストをドロップすることを可能にする方法はありません：あなたの改訂質問に基づいています。あなたが言っていたようにFireFoxエクステンションを構築することを決断しない限り。同じドメインに属していないページをスクリプトできないセキュリティ上の問題を回避できる方法が見つかったとしても、そのDOM/DOMエレメントをドラッグ＆ドロップすることができます。

Answer 4

問題のdivと重複している隠しテキストエリア（CSSスタイルvisibility:hidden）ですか？その後、onchange JavaScriptイベントを使ってドロップをチェックするか、それが機能しない場合は、空でない文字列のテキストエリアの値を定期的にチェックします。私はあなたの走行距離がブラウザとオペレーティングシステムによって異なると推測しています。

Answer 5

私はこれを前にしていますし、少しの努力をしてもライブラリがなくてもできます。お使いのマウスの動きを追跡する

1. 方法：

   私は、次の方法を構築しました。

2. あなたが落とすときに内容を読み込んで渡す方法。
3. ドラッグアンドドロップ方式でonmousemoveイベントとonclickイベントを使用しました。
4. テキストをドロップしたいdiv領域のOnMouseOver - ポインタがコンテナ（div）上にあるかどうかを検出します。
5. 最後に、テキストを削除した後、必要に応じてinnerHTMLを使用して元のコンテンツを削除したので、移動されたように見えます。

これでドラッグアンドドロップ機能のようなWindowsを実現できます。ドラッグ・アンド・ドロップ・イメージ、アイコンなどに使用しました。

コーディングについての助けが必要な場合は、いくつかのガイダンスを伝えることができますが、ほとんどの場合、Googleを少しでも利用すれば、そのほとんどを見つけることができます。