010.xhtml (822B)
1 <?xml version="1.0" encoding="utf-8"?> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>Selection drag and drop from texarea to block element</title> 5 <style type="text/css"> 6 div[ondragenter] 7 {width:300px; 8 height:100px; 9 margin-top:20px; 10 padding:10px; 11 color:white; 12 background-color:navy;} 13 textarea 14 {height:1.5em; 15 width:7em;} 16 </style> 17 </head> 18 <body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)"> 19 <p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p> 20 <p><textarea>Drag me</textarea></p> 21 <div 22 ondragenter="event.preventDefault()" 23 ondragover="return false" 24 ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))" 25 /> 26 </body> 27 </html>