博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【转】使用js触发事件
阅读量:5269 次
发布时间:2019-06-14

本文共 2112 字,大约阅读时间需要 7 分钟。

 

如果大家将一张网页看成一个form的话,大致上就成了一个web form的模型。在win form 下要想手动触发某一个对象的事件是很简单的,只要发送一条消息即可达成。(PostMessage) 但是网页并不是基于消息机制的,如果我们想在一张网页上写出一个类似于按键精灵的功能该如何实现呢?

为大家介绍js下的几个方法:

1. createEvent(eventType)

参数:eventType 共5种类型:
    Events :包括所有的事件. 
          HTMLEvents:包括 'abort', 'blur', 'change', 'error', 'focus', 'load', 'reset', 'resize', 'scroll', 'select', 
                                    'submit', 'unload'. 事件
          UIEvents :包括 'DOMActivate', 'DOMFocusIn', 'DOMFocusOut', 'keydown', 'keypress', 'keyup'.
                                  间接包含 MouseEvents. 
          MouseEvents:包括 'click', 'mousedown', 'mousemove', 'mouseout', 'mouseover', 'mouseup'. 
          MutationEvents:包括 'DOMAttrModified', 'DOMNodeInserted', 'DOMNodeRemoved', 
                                      'DOMCharacterDataModified', 'DOMNodeInsertedIntoDocument', 
                                      'DOMNodeRemovedFromDocument', 'DOMSubtreeModified'. 

2. 在createEvent后必须初始化,为大家介绍5种对应的初始化方法

  HTMLEvents 和 通用 Events:
            initEvent( 'type', bubbles, cancelable )
    UIEvents :
                      initUIEvent( 'type', bubbles, cancelable, windowObject, detail )
    MouseEvents: 
                      initMouseEvent( 'type', bubbles, cancelable, windowObject, detail, screenX, screenY, 
                      clientX, clientY, ctrlKey, altKey, shiftKey, metaKey, button, relatedTarget )
    MutationEvents :
                      initMutationEvent( 'type', bubbles, cancelable, relatedNode, prevValue, newValue, 
                      attrName, attrChange ) 

3. 在初始化完成后就可以随时触发需要的事件了,为大家介绍targetObj.dispatchEvent(event)

    使targetObj对象的event事件触发
  需要注意的是在IE 5.5+版本上请用fireEvent方法,还是浏览兼容的考虑

4. 例子

    //例子1  立即触发鼠标被按下事件

var fireOnThis = document.getElementByIdx_x('someID');        var evObj = document.createEvent('MouseEvents');        evObj.initMouseEvent( 'click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );        fireOnThis.dispatchEvent(evObj);  //例子2  考虑兼容性的一个鼠标移动事件    var fireOnThis = document.getElementByIdx_x('someID');    if( document.createEvent )     {        var evObj = document.createEvent('MouseEvents');        evObj.initEvent( 'mousemove', true, false );        fireOnThis.dispatchEvent(evObj);    }  else if( document.createEventObject )  {      fireOnThis.fireEvent('onmousemove');  }

 

    
321321

 

转载于:https://www.cnblogs.com/katelee/p/7586547.html

你可能感兴趣的文章
echarts饼图显示百分比
查看>>
JMS消息
查看>>
Jenkins+ProGet+Windows Batch搭建全自动的内部包(NuGet)打包和推送及管理平台
查看>>
php上传文件及头像预览
查看>>
大四java实习生的一些经历
查看>>
线程池的概念
查看>>
Oracle_Statspack性能诊断工具
查看>>
转获取sql维护的表关系
查看>>
Java 序列化
查看>>
Java 时间处理实例
查看>>
Java 多线程编程
查看>>
Java 数组实例
查看>>
mysql启动过程
查看>>
2017前端面试题总结
查看>>
Http GetPost网络请求
查看>>
SWIFT国际资金清算系统
查看>>
Sping注解:注解和含义
查看>>
站立会议第四天
查看>>
如何快速掌握一门技术
查看>>
利用AMPScript获取Uber用户数据的访问权限
查看>>