HTMLondragenter属性_
定義と使用法
ondragenter属性は、ドラッグ可能な要素またはテキスト選択が有効なドロップターゲットに入ると起動します。
ondragenterイベントとondragleaveイベントは、ドラッグ可能な要素がドロップターゲットに出入りしようとしていることをユーザーが理解するのに役立ちます。これは、たとえば、ドラッグ可能な要素がドロップターゲットに入るときに背景色を設定し、要素がターゲットから移動するときに色を削除することによって実行できます。
ドラッグアンドドロップについては、 HTML5ドラッグアンドドロップに関するHTMLチュートリアルをお読みください。
ヒント：リンクと画像はデフォルトでドラッグ可能であり、ドラッグ可能な属性は必要ありません。
ドラッグアンドドロップ操作のさまざまな段階で使用され、発生する可能性のある多くのイベント属性があります。
- ドラッグ可能なターゲット（ソース要素）で発生したイベント：
- ondragstart-ユーザーが要素のドラッグを開始したときに発生します
- ondrag-要素がドラッグされているときに発生します
- ondragend-ユーザーが要素のドラッグを終了したときに発生します
- ドロップターゲットで発生したイベント：
- ondragenter-ドラッグされた要素がドロップターゲットに入ると発生します
- ondragover-ドラッグされた要素がドロップターゲットの上にあるときに発生します
- ondragleave-ドラッグされた要素がドロップターゲットを離れたときに発生します
- ondrop-ドラッグされた要素がドロップターゲットにドロップされたときに発生します
に適用されます
ondragenter属性はイベント属性の一部であり、任意のHTML要素で使用できます。
| 要素 | イベント |
|---|---|
| すべてのHTML要素 | ondragenter |
例
Divの例
ドラッグ可能な要素がドロップターゲットに入ったときにJavaScriptを実行します。
<div ondragenter="myFunction(event)"></div>
ブラウザのサポート
表の数字は、イベント属性を完全にサポートする最初のブラウザバージョンを示しています。
| Event Attribute | |||||
|---|---|---|---|---|---|
| ondragenter | 4.0 | 9.0 | 3.5 | 6.0 | 12.0 |