質問: domの要素ををtextarea(dropした位置 jquery ui のdraggable,droppableを使って、あるdomの要素ををtextarea(dropした位置)に挿入したいです。 ドラッグ、ドロップは普通に動かせるのですが、以下の機能が実装できません。 情報お持ちの方、いらっしゃいましたら、お願いします。 ドラッグ中、または、ドロップした瞬間に、textareaのキャレット位置を取得する 実装方法が思いつきません。 (ドロップ時点です。) 欲を言えば、ドラッグ中にキャレット位置を表示させたいです。 ※ちょうど、chromeやffで画像をテキストエリアにドラッグするようなイメージです。
回答: 全部は書けないのでヒントだけ http://msdn.microsoft.com/en-us/library/ms535861(v=vs.85).aspx を利用するといい。 後は、 ondragstart ondragenter ondragstop でそれぞれで event.x event.y を拾えばいい。 互換性はcss3ぐらいなのか。もともとie5.5では実装されていたが、正式にはie9からのようで、仕様がcss3になるようで、別の動作になる。css3対応のブラウザなら動作する。ieはdoctypeの変更で対応。 単にondragstartだと、ドラックしている間は、そのオブジェクトがactiveなので、その途中のx,yは取れない。なので、datatransferを使えば、途中も拾えるのでドロップした時には、キャレットのx,yをevent発生ポイントで拾える。 これはdivにも適用できるので、formオブジェクト以外もok。 サンプルページがついているので、ためしてください。 jquery uiは http://jqueryui.com/download で、デベロッパーをdlするとサンプルが付いてくるので、それをテンプレートとすればわかるはずですが。