通常、マークされたテキストが HTML 入力要素にドラッグ アンド ドロップされると、マークされたテキストがその入力フィールドのカーソル位置にコピーされます (既存のテキストに追加されます)。jQuery を使用してその動作を (たとえば) Firefox のアドレス フィールドの動作に似るように変更したいと思います。
- テキストは、入力することで追加および変更できます (通常どおり)。
- テキストが外部からドラッグされて入力要素にドロップされると、入力内のすべての既存のテキストがドラッグされたテキストに置き換えられます。
- 入力フィールド内でテキストをドラッグ アンド ドロップすると、ドラッグしたテキストがカーソルの位置に移動します。（あると便利な機能ですが、それほど重要ではありません）
これを達成する方法を知っている人はいますか？どんな助けでも大歓迎です。
このためには、ある種の「ドラッグ アンド ドロップ」イベントを認識し、ドラッグされたテキストにアクセスする必要があるように思えますが、これが可能かどうかはわかりません。私が念頭に置いているシナリオの (非機能的な) モックアップは、次のようになります。
HTML:
<p>drag-and-drop text into this:</p>
<input id="giveittome" value="some text"></input>
<p>other text</p>
<p>more text</p>
<p>whatever</p>
JavaScript:
$('#giveittome').on('drag-and-drop' , function (event) {
$(this).val(event.getDraggedText());
});