js 主动触发事件

    //主动触发事件:触发鼠标被按下事件
    var btn2 =document.getElementById("btn2");
    var btn  = document.getElementById("btn");

        //步骤1:先创建1个事件
    var evObj = document.createEvent("MouseEvents");
       //步骤2:初始化这个event
    evObj.initEvent("click",true,true);
        //步骤3:触发这个event:目标obj.dispatchEvent()
        // 点击第二个按钮,触发第一个按钮的按下事件
    btn2.onclick = function(){
        btn.dispatchEvent(evObj);
    }

html code:

<button id="btn">我是button</button>
<button id="btn2">触发前面那个按钮的点击事件</button>
时间: 2024-10-27 13:08:33

js 主动触发事件的相关文章

原生js自动触发事件

熟悉jquery的童鞋都知道在jq中有一个方法可以自动触发事件,那就是trigger(),那么通过原生js又怎么模拟触发呢? js中添加一个主动触发事件的方法有dispatch.该方法能模拟用户行为,如点击(click)操作等. 标准使用dispatchEvent方法,IE6/7/8则使用fireEvent方法. dispatchEvent() 方法给节点分派一个合成事件. 语法如下: dispatchEvent(eventObj) eventObj 参数是一个描述事件的 ActionScrip

JQuery 自己主动触发事件

经常使用模拟 有时候,须要通过模拟用户操作,来达到单击的效果.比如在用户进入页面后,就触发click事件,而不须要用户去主动单击. 在JQuery中.能够使用trigger()方法完毕模拟操作.比如能够使用以下的代码来触发id为btn的button的click事件. 1 $('#btn').trigger("click"); 这样,当页面载入完成后.就会立马输出想要的效果.也能够直接简写click().来达到相同的效果: 1 $('#btn').click(); 触发自己定义事件 tr

js原生触发事件

在JQ时代我们使用如下方式,可以手动触发事件 $("button").click(function(){ $("input").trigger("select"); }); 但是如今的web application 已经淘汰JQ了,原生怎么写呢?很简单 先new一个事件,然后dom.dispatchEvent就可以了 const event = new Event('resize'): window.dispatchEvent(event); 原

JS手动触发事件,转载

1. createEvent(eventType)参数:eventType 共5种类型:    Events :包括所有的事件.           HTMLEvents:包括 'abort', 'blur', 'change', 'error', 'focus', 'load', 'reset', 'resize', 'scroll', 'select',                                     'submit', 'unload'. 事件          U

JS 页面加载触发事件 document.ready和onload的区别

JS 页面加载触发事件 document.ready和onload的区别 document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 1.Dom Ready 用jQ的人很多人都是这么开始写脚本的: $(function(){       // do something }); 例如: $(functi

html5与js关于input[type=&#39;text&#39;]文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick=&quot;select();&quot;。做购物车页面时会要用到。

关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="select();".做购物车页面时会要用到. input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange: 1.onchange事件与onpropertychange事件的区别:onchange事件在内容改变(两次

JS中自定义事件的使用与触发

1. 事件的创建 JS中,最简单的创建事件方法,是使用Event构造器: var myEvent = new Event('event_name'); 但是为了能够传递数据,就需要使用 CustomEvent 构造器: var myEvent = new CustomEvent('event_name', { detail:{ // 将需要传递的数据写在detail中,以便在EventListener中获取 // 数据将会在event.detail中得到 }, }); 2. 事件的监听 JS的E

js页面触发chargeRequest事件和Nginx获取日志信息

注:图片如果损坏,点击文章链接:https://www.toutiao.com/i6814836302966424072/ 承接上一篇文档<js页面触发pageView和event事件编写> chargeRequest事件 该事件的主要作用是记录用户产生订单的行为/数据 思路图 Keys添加信息 服务器名称列表 chargeRequest事件代码 继续编写 对外暴露方法 准备测试页面 页面代码 访问地址 页面效果 点击按钮发送数据 Nginx日志生成 JsSDK生成日志数据,发送到Nginx服

JS触发事件大全

      事件 浏览器支持 解说 一般事件 onclick IE3.N2 鼠标点击时触发此事件 ondblclick IE4.N4 鼠标双击时触发此事件 onmousedown IE4.N4 按下鼠标时触发此事件 onmouseup IE4.N4 鼠标按下后松开鼠标时触发此事件 onmouseover IE3.N2 当鼠标移动到某对象范围的上方时触发此事件 onmousemove IE4.N4 鼠标移动时触发此事件 onmouseout IE4.N3 当鼠标离开某对象范围时触发此事件 onke