• html5 drag drop


    // 生命周期
    //dragstart -> drag -> dragenter -> dragover ->  dragleave  -> drop -> //dragend   
    //拖拽元素 dragstart ->drag ->dragend
    //目标元素 dragenter ->dragover ->drop->dragleave 
    
    // 用户开始拖动元素时触发
        dragstart (item) {
            //ie下 要return true 并且不可阻止默认行为
          return true;
        },    
     // 元素正在拖动时触发
        drag (item) {
           //ie下不可阻止默认行为  而且不需要return
          /*if (event && event.preventDefault) {//如果是FF下执行这个
    
            event.preventDefault();
          }else{
            window.event.returnValue = false;//如果是IE下执行这个
    
          }*/
        },
    // 用户完成元素拖动后触发
        dragend (item) {
        //ie下要阻止默认行为  并且return false
          if (event && event.preventDefault) {//如果是FF下执行这个
    
            event.preventDefault();
          }else{
            window.event.returnValue = false;//如果是IE下执行这个
    
          }
          return false
        },
    //没用上
       dragoverHeader () {
          if (event && event.preventDefault) {//如果是FF下执行这个
    
            event.preventDefault();
          }else{
            window.event.returnValue = false;//如果是IE下执行这个
    
          }
        },
     // 当被鼠标拖动的对象进入其容器范围内时触发此事件
        dragenter (item) {
         //ie 下 要阻止默认行为 并且return true
          if (event && event.preventDefault) {//如果是FF下执行这个
    
            event.preventDefault();
          }else{
            window.event.returnValue = false;//如果是IE下执行这个
    
          }
          return true;
        },
        // 当某被拖动的对象在另一对象容器范围内拖动时触发此事件
        dragover (item) {
          //ie 下 要阻止默认行为 并且return true
          if (event && event.preventDefault) {//如果是FF下执行这个
    
            event.preventDefault();
          }else{
            window.event.returnValue = false;//如果是IE下执行这个
    
          }
          // 只有当可拖动,而且没有禁用的才执行下面的代码,并且不是自身
          if (this.allowDrag && this.notSelf) {
            // 设置当前的hoverNode
            this.hoverNode = item
          }
          return true;
        },    
     // 在一个拖动过程中,释放鼠标键时触发此事件
        drop (item) {
          //ie下要阻止默认行为
          if (event && event.preventDefault) {//如果是FF下执行这个
    
            event.preventDefault();
          }else{
            window.event.returnValue = false;//如果是IE下执行这个
    
          }
       
        },    
    学习是对自己负责,自己是职业发展的负责人!
  • 相关阅读:
    触发器
    自定义变量
    系统变量
    Interval 计时器
    Ajax 之 DWR
    cssTest
    Ajax之XMLHttpRequst对象
    添加页面元素
    jquery 基础
    jQuery 自定义动画效果
  • 原文地址:https://www.cnblogs.com/Webyangbowen/p/10030441.html
Copyright © 2020-2023  润新知