私は現在、編集可能なテキスト領域のリストを含むページを作成するWebアプリケーションに取り組んでおり、各テキスト領域を目的の位置にドラッグアンドドロップするだけで順序を変更できるようにしたいと考えています。
基本的に、これらの各テキスト領域は、次のようにネストされます。
<div class="outsideDiv">
<div>
<textarea>
</textarea>
</div>
</div>
ネイティブHTML5の「ドラッグ可能」属性を使用してドラッグアンドドロップ機能を実装しようとしたとき(より正確には、最も外側の属性として配置しました)、テキスト領域をドラッグ可能にするだけでなく、副作用も発生することに気付きました。テキスト領域をクリックすると、入力カーソルは常に位置0になります。したがって、カーソルを別の位置に移動することはできません。これは、既存のテキストを編集する場合にはそれほど便利ではありません。
だから私の質問は、そのすべての機能を維持しながら(つまり、前述の副作用なしに)テキスト領域をドラッグ可能にするにはどうすればよいですか?