031.xhtml (881B)
1 <?xml version="1.0" encoding="utf-8"?> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>Dragging two lines of text selection from textarea 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 {width:300px; 15 height:100px;} 16 </style> 17 </head> 18 <body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(25,56)"> 19 <p> 20 <textarea> 21 Here is textarea 22 with selection that 23 spans two lines. 24 Drag selected text to the blue box. 25 Selected text should be moved to the blue box once you drop it there. 26 </textarea> 27 </p> 28 <div 29 ondragenter="event.preventDefault()" 30 ondragover="return false" 31 ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))" 32 /> 33 </body> 34 </html>