JavaScript DHTML/Document/Drag Drop

Материал из Web эксперт
Перейти к: навигация, поиск

"dragDrop()" Example

    
<html>
<body>
<script language="JavaScript">
function function1() {
    document.all.sourceObject.dragDrop()
    var m = document.all.sourceObject.dragDrop()
    alert(m+".\nDrag operation is not yet completed") 
} 
</script>
<div onmouseup="function1();">
<input id="sourceObject" size=50 value="The (whole or part) text to drag">
<p>Drop selected text into the following text field.</p>
<input id="targetObject" size=50 value="Drag destination element">
</div>
</body>
</html>



"dropEffect" Example

    
<html>
<head>
<script language="JavaScript">
function transferDrop() {
    window.event.srcElement.innerText = window.event.dataTransfer.getData("text");
    window.event.returnValue = false; 
} 
function transferDrag() { 
    window.event.dataTransfer.dropEffect = "move"; 
    window.event.returnValue = false; 
} 
</script>
</head>
<body bottommargin="150">
<p id="mySource" 
   ondragstart="window.event.dataTransfer.effectAllowed="move";">
   Highlight text in this paragraph and drag it to the text area bellow
</p>
<textarea id="myTarget" 
          ondrop="transferDrop();" 
          ondragover="window.event.returnValue = false;" 
          ondragenter="transferDrag();">
</textarea>



"effectAllowed" Example

    
<html>
<head>
<script language="JavaScript">
function transferDrop() {
    window.event.srcElement.innerText = window.event.dataTransfer.getData("text");
    window.event.returnValue = false; 
} 
function transferDrag() { 
    window.event.dataTransfer.dropEffect = "move"; 
    window.event.returnValue = false; 
} 
</script>
</head>
<body bottommargin="150">
<p id="mySource" 
   ondragstart="window.event.dataTransfer.effectAllowed="move";">
   Highlight text in this paragraph and drag it to the text area bellow
</p>
<textarea id="myTarget" 
          ondrop="transferDrop();" 
          ondragover="window.event.returnValue = false;" 
          ondragenter="transferDrag();">
</textarea>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/Document/Drag_Drop&oldid=1901»