事件类型:
     1.界面事件
         onload:描述文档,图片,css已经frame,object加载完毕时触发,window.onload
         window.onload = function(){
             //代表图片,dom元素,iframe,css加载完毕以后
             //才触发的事件
         }
         $(function(){
             //dom  css js 初始化就加载事件
             //调用了图片的unload事件
         });

         onunload:移除加载事件
         onabort:XMLHttpRequest
         onerror:文档加载失败,图片加载失败的时候调用事件,XMLHttpRequest
             请求失败是调用的函数
         onresize:一般用于窗口,body,frameset改变窗口大小的时候调用
         onscroll:用户滚动文档触发的事件
         oncontextmenu:右键触发的事件
     2.聚焦事件
         blur:
         focus
         focusin
         focusout
     3.表单事件
         onchange
         onreset
         onsubmit
         onselect
     4.鼠标事件
         onclick
         ondbclick
         onmousedown
         onmousemove
         onmouseover
         onmouseup
         onmouseleave
     5.滚轮事件
         wheel
     6.键盘事件
         onkeydown
         onkeyup
         onpress
     7.触屏事件
         ontouchstart
         ontouchchend
         ontouchmove
         ontouchleave
     8.window,body中的嵌套事件
         onafterprint:文档打印时候立刻会执行方法
         onbeforeprint:打印之前执行事件
         onpagehide:当浏览器即将离开的事件
         onpageshow:当浏览器即将立刻的事件
         onbeforeunload:当浏览器即将立刻的事件
     拖拽事件
         ondrag
         ondragstart
         ondragend
         ondragenter
         ondragleaveover
     文档事件
         onreadystatechange:XMLHttpRequest

 javascript中一般使用:addEventListener进行监听事件 
<!doctype html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>js</title>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>

    <style type="text/css">
        *{margin:0;padding:0;}
        body{font-size:16px;font-family:"微软雅黑";color:#666;
            background:#fff;
        }
        #box{font-size:64px;margin:100px auto;}
    </style>
</head>
<body>

    <div id="box">click me</div>
    <script type="text/javascript">
        /*
            一个元素绑定事件分为两种:一种属性事件和动态绑定事件addEventListener
            可以互相兼容,同一种事件类型是进行覆盖

            addEventListener(事件类型,回调函数,cp(true/false))
            true:事件扑捉
            false:事件冒泡

            为什么推荐使用冒泡,而不用事件扑捉
            默认就是冒泡行为
            阻止冒泡:event.stopPropagation();
            阻止默认行为:event.preventDefault

            有默认行为的标签:a, 输入框,checkbox radio
        */

        window.addEventListener("click",function(){
            console.log("window的点击事件");
        },false);

        document.addEventListener("click",function(){
            console.log("document的点击事件");
        },false);

        document.body.addEventListener("click",function(){
            console.log("body的点击事件");
        },false);

        document.querySelector("div").addEventListener("click",function(e){
            console.log("div的点击事件");
            e.stopPropagation();
        },false);
    </script>
</body>
</html>

javascript事件有哪些?javascript的监听事件的更多相关文章

  1. JAVAscript学习笔记 js句柄监听事件 第四节 (原创) 参考js使用表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Vue 为什么在 HTML 中监听事件?

    为什么在 HTML 中监听事件? 你可能注意到这种事件监听的方式违背了关注点分离(separation of concern)传统理念.不必担心,因为所有的 Vue.js 事件处理方法和表达式都严格绑 ...

  3. js监听事件 上滑消失下滑出现的效果 触摸与手势事件

    https://www.w3cmm.com/javascript/touch.html //触摸与手势事件连接tinyscrollbar //方法1var _this = $('#fabu');var ...

  4. js中的监听事件总结

    javascript事件与功能说明大全:http://tools.jb51.net/table/javascript_event 1.滚动条监听事件 例1:监听滚动条距离页面顶端距离 <scri ...

  5. Android中Button的五种监听事件

    简单聊一下Android中Button的五种监听事件: 1.在布局文件中为button添加onClick属性,Activity实现其方法2.匿名内部类作为事件监听器类3.内部类作为监听器4.Activ ...

  6. Second Day: 关于Button监听事件的三种方法(匿名类、外部类、继承接口)

    第一种:通过匿名类实现对Button事件的监听 首先在XML文件中拖入一个Button按钮,并设好ID,其次在主文件.java中进行控件初始化(Private声明),随后通过SetOnClickLis ...

  7. js 获取当前焦点所在的元素、给元素和input控件添加键盘监听事件、添加页面级的键盘监听事件

    页面级的键盘监听事件 document.onkeydown = function (event) { var e = event || window.event || arguments.callee ...

  8. android listview 的监听事件

    今天遇到了一个比较让我头疼的问题,不过追根揭底只是我对listview理解的不够透彻罢了, 闲言少叙,说说我遇到的问题吧: 上篇随笔我写了关于listview的使用,如果你也已经写好了列表那么恭喜这一 ...

  9. Android成长日记-Android监听事件的方法

    1. Button鼠标点击的监听事件 --setOnClickListener 2. CheckBox, ToggleButton , RadioGroup的改变事件 --setOnCheckedCh ...

随机推荐

  1. ASP.NET MVC Autofac自动注入

    依赖注入容器有很多插件,我用过Unity和Autofac,这两个插件给我最明显的感觉就是Autofac很快,非常的快,毕竟是第三方开发的,而Unity相对而言性能比较稳定 下面附上Autofac自动注 ...

  2. ORACLE Linux以及 Unbreakable Enterprise Kernel

    Oracle Linux,全称为Oracle Enterprise Linux,简称OEL,Linux发行版本之一.Oracle公司在2006年初发布第一个版本,以对Oracle软件和硬件支持较好见长 ...

  3. asp.net mvc后台操作之读写xml控制首页动态页面开关显示

    一.背景 在asp.net mvc项目里,用户需要开拓几个活动版面,并以侧栏的方式呈现在首页右侧,几个活动时间不一致,为避免浏览者在活动未开放之时进入未开放的服务页面.因此不仅需要在活动代码中加入限制 ...

  4. Android Service 与 IntentService

    Service 中的耗时操作必须 在 Thread中进行: IntentService 则直接在 onHandleIntent()方法中进行

  5. C程序演示产生僵死进程的过程

    先抄录网上一段对僵死进程的描述: 僵尸进程:一个进程使用fork创建子进程,如果子进程退出,而父进程并没有调用wait或waitpid获取子进程的状态信息,那么子进程的进程描述符仍然保存在系统中.这种 ...

  6. 布朗语料库中条件概率分布函数ConditionalFreqDist使用

    布朗语料库中使用条件概率分布函数ConditionalFreqDist,可以查看每个单词在各新闻语料中出现的次数.这在微博情感分析中非常有用,比如判断feature vector中代表positive ...

  7. ssh框架整合---- spring 4.0 + struts 2.3.16 + maven ss整合超简单实例

    一 . 需求 学了这么久的ssh,一直都是别人整合好的框架去写代码,自己实际动手时才发现框架配置真是很坑爹,一不小心就踏错,真是纸上得来终觉浅! 本文将记录整合struts + spring的过程 , ...

  8. MQ安装配置

        (1)执行接受许可脚本: ./mqlicense.sh –accept  (2) 安装 WebSphere MQ for Linux 服务器: [root@localhost mq]# rpm ...

  9. Ubuntu 12.04 LTS 及ubuntu14.10 -- NFS安装

    在Linux 服务器上配置好NFS 根文件系统后,在单板侧挂载NFS 文件系统,具体操作如下:ifconfig eth0 hw ether 00:10:85:18:01:84 /*配置MAC地址*/i ...

  10. 一次非常有意思的 SQL 优化经历

    我用的数据库是mysql5.6,下面简单的介绍下场景 课程表 create table Course( c_id int PRIMARY KEY, name varchar(10) ) 数据100条 ...