详细介绍html5之拖放的示例代码

1)创建来源项目

  1.1)draggable属性的值：

      true——此元素能被拖动；

      false——此元素不能被拖动；

      auto——浏览器可以自主决定某个元素是否能被拖动；

立即学习“前端免费学习笔记（深入）”；

  1.2）被拖动元素的事件：

      dragstart——在元素开始被拖动时触发；

      drag——在元素被拖动时反复触发；

      dragend——在拖动操作完成时触发；

2）创建释放区

   2.1）释放区事件：

        dragenter——当被拖动元素进入释放区所占据的屏幕空间时触发；

        dragover——当被拖动元素在释放区内触发时移动触发；

        dragleave——当被拖动元素没有放入就离开释放区时触发；

        drop——当被拖动元素在释放区放下时触发；

    
        
        
    
    
        

            @@##@@
            @@##@@
            @@##@@
            

                
Drop Here
            
            
        
            
    
        
    

3)使用DataTransfer对象

《PHP设计模式指南》中文版

《PHP设计模式》首先介绍了设计模式，讲述了设计模式的使用及重要性，并且详细说明了应用设计模式的场合。接下来，本书通过代码示例介绍了许多设计模式。最后，本书通过全面深入的案例分析说明了如何使用设计模式来计划新的应用程序，如何采用PHP语言编写这些模式，以及如何使用书中介绍的设计模式修正和重构已有的代码块。作者采用专业的、便于使用的格式来介绍相关的概念，自学成才的编程人员与经过更多正规培训的编程人员

下载

  3.1)与拖放操作所触发的事件同时派发的对象是DragEvent，它派生于MouseEvent。

  DragEvent对象定义的额外属性：

  dataTransfer——返回用于传输数据到释放区的对象（DataTransfer）；

  3.2)DataTransfer对象定义的属性：

  types——返回数据的格式；

  getData()——返回指定格式的数据；

  setData(,)——设置指定格式的数据；

  clearData()——移除指定格式的数据；

  files——返回已被拖动文件的列表；  

    
        
        
    
    
        

            @@##@@
            @@##@@
            @@##@@
            

                
Drop Here
            
            
        
            
    
        
    

    3.3）拖放文件：

    File对象定义的属性

    name——获取文件名；

    type——获取文件类型，以MIME类型表示；

    size——获取文件大小（以字节计算）；

    
        
        
    
    
        

            

                

                    
Bananas:
                    

                

                

                    
Apples:
                    

                

                

                    
Cherries:
                    

                

                

                    
File:
                    

                

                

                    
Total:
                    
0 items
                
                
            

            

                
Drop Files Here
            
            
            Submit Form