systemdraganddropexample8.htm

来自「这是javascript高级程序设计的源码」· HTM 代码 · 共 38 行

HTM

38 行

<html>
    <head>
        <title>System Drag And Drop Example</title>
        <script type="text/javascript">
            function handleDragDropoEvent(oEvent) {
               
                switch(oEvent.type) {
                    case "dragstart":
                        oEvent.dataTransfer.effectAllowed = "move";
                        break;
                        
                    case "dragenter":
                        oEvent.dataTransfer.dropEffect = "move";
                        break;
                        
                    case "dragover":
                        oEvent.returnValue = false;
                        break;
                    case "drop":
                        oEvent.returnValue = false;
                        oEvent.srcElement.innerHTML = oEvent.dataTransfer.getData("text");
                }
            }                        
        </script>
    </head>
    <body>
        <p>Try dragging the text in the textbox to the red square.
        The text will be "moved" to the red square.</p>
        <p><input type="text" value="drag this text" ondragstart="handleDragDropoEvent(event)" />
        <div style="background-color: red; height: 100px; width: 100px"
             ondragenter="handleDragDropoEvent(event)"               
             ondragover="handleDragDropoEvent(event)" 
             ondrop="handleDragDropoEvent(event)"></div>        
        </p>

    </body>
</html>

systemdraganddropexample8.htm - 源码说明

本页面展示了「这是javascript高级程序设计的源码」中的 systemdraganddropexample8.htm 源码文件，采用 HTM 编程语言编写，共 38 行代码。您可以在线阅读完整代码内容，也可以返回资源详情页下载完整源码包进行本地学习和开发。

虫虫下载站收录了大量与javascript相关的技术资源，包括源代码、技术文档、电路图等，是电子工程师和嵌入式开发者的专业学习平台。

⌨️ 快捷键说明

复制代码Ctrl + C

搜索代码Ctrl + F

全屏模式F11

增大字号Ctrl + =

减小字号Ctrl + -

显示快捷键?