ECMA5:

function Drag(id){
this.ele = document.getElementById(id);
var that = this;
this.ele.onmousedown = function(evt){
that.fnDown(evt);
}
this.fnDown = function(evt){
var e = evt || window.event;
this.disX = e.offsetX;
this.disY = e.offsetY;
var that = this;
document.onmousemove = function(evt){
that.fnMove(evt);
}
document.onmouseup = this.fnUp;
}
this.fnMove = function(evt){
var e = evt || window.event;
this.ele.style.left = e.pageX - this.disX + 'px';
this.ele.style.top = e.pageY - this.disY + 'px';
}
this.fnUp = function(){
document.onmousemove = null;
}
} ECMA6: class Drag{
constructor(id){
//属性
this.ele = document.getElementById(id);
var that = this;
this.ele.onmousedown = function(evt){
that.fnDown(evt);
}
}
fnDown(evt){
var e = evt || window.event;
this.disX = e.offsetX;
this.disY = e.offsetY;
var that = this;
document.onmousemove = function(evt){
that.fnMove(evt);
}
document.onmouseup = this.fnUp;
}
fnMove(evt){
var e = evt || window.event;
this.ele.style.left = e.pageX - this.disX + 'px';
this.ele.style.top = e.pageY - this.disY + 'px';
}
fnUp(){
document.onmousemove = null;
}
}

16-1 ECMA5与ECMA6的函数定义的更多相关文章

  1. 函数定义从零开始学C++之从C到C++(一):const与#define、结构体对齐、函数重载name mangling、new/delete 等

    今天一直在学习函数定义之类的问题,下午正好有机会和大家共享一下. 一.bool 类型 逻辑型也称布尔型,其取值为true(逻辑真)和false(逻辑假),存储字节数在不同编译系统中可能有所不同,VC+ ...

  2. Scala类型声明与定义、函数定义、流程控制、异常处理

    Scala源代码被编译成Java字节码,所以它可以运行于JVM之上,并可以调用现有的Java类库. Scala的基础类型基本与javascript一致. Scala的数据类型全部相同于Java中,具有 ...

  3. Python 2.7 学习笔记 基本语法和函数定义

    本文介绍下python的基本语法 一.变量定义 不需要说明类型,也不需要像js等脚本语言使用var等标识符.直接声明即可,如: num=1 说明:上面语句声明了一个变量num,并在声明时初始化值为 1 ...

  4. 教你看懂C++类库函数定义之一---HRESULT 宏

    一切从一个C++ 类库头文件开始,现在在做一个C++的项目,期间用到一个开源的界面库DUILib(类似MFC),这个东西还不错能很容易的写出漂亮的界面,比如QQ的界面,可以去下载下来研究研究,地址:h ...

  5. lua os.date函数定义和示例

    os.date函数定义 原型:os.date ([format [, time]]) 解释:返回一个按format格式化日期.时间的字串或表. lua源码中os.date的注释如下: --- --- ...

  6. 9 - Python函数定义-位置参数-返回值

    目录 1 函数介绍 1.1 为什么要使用函数 1.2 Python中的函数 2 函数的基本使用 3 函数的参数 3.1 参数的默认值 3.2 可变参数 3.2.1 可变位置传参 3.2.2 可变关键字 ...

  7. python开发_python中的函数定义

    下面是我做的几个用列: #python中的函数定义,使用和传参 def_str = '''\ python中的函数以如下形式声明: def 函数名称([参数1,参数2,参数3......]): 执行语 ...

  8. Python 函数定义以及参数传递

    Python 函数定义以及参数传递1.函数定义#形如def func(args...): doSomething123以关键字def 开头,后面是函数名和参数下面是函数处理过程. 举例: def ad ...

  9. 深入理解javascript函数定义与函数作用域

    最近在学习javascript的函数,函数是javascript的一等对象,想要学好javascript,就必须深刻理解函数.本人把思路整理成文章,一是为了加深自己函数的理解,二是给读者提供学习的途径 ...

随机推荐

  1. 修改编辑器为Markdown编辑器

    一直都在使用cnblogs的TinyMCE,不过感觉好久不更新,还是用Markdown吧,写多了Markdown 还真是受感染呢. 学习下吧,边学便用. 参考链接: 序列图 [简明版]有道云笔记Mar ...

  2. Geek/Git中文怎么读

    Geek怎么读 英[gi:k] = gay客 = 给客 Git怎么读 英[gɪt] = gay 特 = 给特 Flux怎么读 英[flʌks] = 佛拉克斯 Redux怎么读 英[ri:'dʌks] ...

  3. openssl RSA密钥格式PKCS1和PKCS8相互转换

    RSA私钥格式PKCS1和PKCS8相互转换 RSA公钥格式PKCS1和PKCS8相互转换 以下转换基于openssl命令的操作: 1. openssl 生成pkcs1格式的私钥,密钥长度1024位, ...

  4. Add Columns to the Web Sessions List

    To add custom columns to the Web Sessions List, add rules using FiddlerScript. The BindUIColumn Attr ...

  5. Nginx——location匹配与在配置中的优先级

    1. location表达式类型 location ^~ /api/v7/ { proxy_next_upstream http_404 http_500 http_502 http_503 http ...

  6. [MHA]master_ip_failover 测试可以使用的IP 地址切换脚本

    #!/usr/bin/env perluse strict;use warnings FATAL => 'all'; use Getopt::Long; my (    $command,    ...

  7. JAVA方法中的参数用final来修饰的原因

    JAVA方法中的参数用final来修饰的原因   很多人都说在JAVA中用final来修饰方法参数的原因是防止方法参数在调用时被篡改,其实也就是这个原因,但理解起来可能会有歧义,有的人认为是调用语句的 ...

  8. Vue2的独立构建与运行时构建的差别

    其实这个问题在你使用vue-cli构建项目的时候是不会出现的,因为你在创建项目的构建过程中已经让你勾选了,然后会写入webpack.config.js中. 这就在这,会让你选择Vue的构建方式. 如果 ...

  9. 如何免费的将本地Web服务映射到外网

    链接地址:https://hongmaju.github.io/2018/05/13/ngrok%E5%B0%86%E6%9C%AC%E5%9C%B0Web%E6%9C%8D%E5%8A%A1%E6% ...

  10. SQL Server 2016新特性:Temporal Table

    什么是系统版本的Temporal Table 系统版本的Temporal Table是可以保存历史修改数据并且可以简单的指定时间分析的用户表. 这个Temporal Table就是系统版本的Tempo ...