在爬代码过程中,碰到一个稀奇古怪的问题。需要手工修改select的值,然后手动触发select的change事件,但使用网络上查到的通过trigger、onchange()事件触发都不执行,没办法,只好继续查找。

还好在stackoverflow网站上看到国外大神的回答,解决了碰到的问题。

原帖地址:http://stackoverflow.com/questions/2490825/how-to-trigger-event-in-javascript

手工触发的代码如下:

/**
* Fire an event handler to the specified node. Event handlers can detect that the event was fired programatically
* by testing for a 'synthetic=true' property on the event object
* @param {HTMLNode} node The node to fire the event handler on.
* @param {String} eventName The name of the event without the "on" (e.g., "focus")
*/
function fireEvent(node, eventName) {
// Make sure we use the ownerDocument from the provided node to avoid cross-window problems
var doc;
if (node.ownerDocument) {
doc = node.ownerDocument;
} else if (node.nodeType == 9){
// the node may be the document itself, nodeType 9 = DOCUMENT_NODE
doc = node;
} else {
throw new Error("Invalid node passed to fireEvent: " + node.id);
} if (node.dispatchEvent) {
// Gecko-style approach (now the standard) takes more work
var eventClass = ""; // Different events have different event classes.
// If this switch statement can't map an eventName to an eventClass,
// the event firing is going to fail.
switch (eventName) {
case "click": // Dispatching of 'click' appears to not work correctly in Safari. Use 'mousedown' or 'mouseup' instead.
case "mousedown":
case "mouseup":
eventClass = "MouseEvents";
break; case "focus":
case "change":
case "blur":
case "select":
eventClass = "HTMLEvents";
break; default:
throw "fireEvent: Couldn't find an event class for event '" + eventName + "'.";
break;
}
var event = doc.createEvent(eventClass); var bubbles = eventName == "change" ? false : true;
event.initEvent(eventName, bubbles, true); // All events created as bubbling and cancelable. event.synthetic = true; // allow detection of synthetic events
node.dispatchEvent(event, true);
} else if (node.fireEvent) {
// IE-old school style
var event = doc.createEventObject();
event.synthetic = true; // allow detection of synthetic events
node.fireEvent("on" + eventName, event);
}
};

html代码和调用如下

<a href="http://www.google.com" onclick="alert('clicked')" target="_blank">Go to google</a>
<button>Trigger event</button> document.getElementsByTagName("button")[0].onclick = function() {
fireEvent(document.getElementsByTagName("a")[0], "click");
}

手动触发dom节点事件代码的更多相关文章

  1. 是否是有效的dom节点--轮子代码

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title> ...

  2. visual studio 2013 触发挂起事件

    在 VS2013 中调试 winddows phone 或者 win rt 程序的时候,需要手动触发 “挂起” 事件. 如果找不到这个按钮: 1.打开菜单栏中的 “自定义” 对话框: 2.选择调试位置 ...

  3. DOM事件代码小结

    以下代码出自<DOM Enlightenment>一书1.三种事件形式 <body onclick="alert('触发内联属性事件')"> <div ...

  4. 节点操作,节点属性的操作及DOM event事件

    ##1. 节点操作 createElement(标签名) 创建一个指定名称的元素 someone.appendChild(new_node) 追加一个子节点(作为最后的子节点) someone.ins ...

  5. React 事件对象、键盘事件、表单事件、ref获取dom节点、react实现类似Vue双向数据绑定

    1.案例实现代码 import React, { Component } from 'react'; /** * 事件对象.键盘事件.表单事件.ref获取dom节点.react实现类似Vue双向数据绑 ...

  6. 六、React 键盘事件 表单事件 事件对象以及React中的ref获取dom节点 、React实现类似Vue的双向数据绑定

    接:https://www.cnblogs.com/chenxi188/p/11782349.html 事件对象 .键盘事件. 表单事件 .ref获取dom节点.React实现类似vue双向数据绑定 ...

  7. DOM节点的使用(常用方法+代码)

    DOM节点的应用 学习总结 1. 什么是 DOM 2. HTMLDOM 3. 元素获取 元素获取方式 元素节点的属性操作 4. Node 对象的属性和方法 常用属性 常用方法 5. 事件处理 事件驱动 ...

  8. 关于dom节点绑定滑动事件导致浏览器上下滑动失效解决方案--黄丕巧

    1.移动端开发往往需要添加一下自定义的左右滑动事件,但是添加了左右滑动事件之后就要阻止浏览器大默认事件,否则dom节点的滑动事件和浏览器本身的滑动会出现冲突,导致滑动的时候会出现消失瞬间再出现的效果 ...

  9. jQuery之防止冒泡事件,冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件。

    冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. 下面是html代码部分: <body> <div id="content"> 外层div元素 ...

随机推荐

  1. AtCoder ABC 085C/D

    C - Otoshidama 传送门:https://abc085.contest.atcoder.jp/tasks/abc085_c 有面值为10000.5000.1000(YEN)的纸币.试用N张 ...

  2. Android一键换肤功能:一种简单的实现

     Android一键换肤功能:一种简单的实现 现在的APP开发,通常会提供APP的换肤功能,网上流传的换肤代码和实现手段过于复杂,这里有一个开源实现,我找了一大堆,发现这个项目相对较为简洁:htt ...

  3. Windows独享主机如何修改远程登录3389端口

    ” 完 成数值修改操作后,我们再将鼠标定位于注册表分支HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet \Control\Terminal Server\WinS ...

  4. MapReduce Shuffle优化方向

    Shuffle过程介绍可以查看该博客:http://langyu.iteye.com/blog/992916 优化方向: 压缩:对数据进行压缩,减少写读数据量: 减少不必要的排序:并不是所有类型的Re ...

  5. [转]C#——细说事务

    转自:风尘浪子 - 博客园 引言 其实事务在数据层.服务层.业务逻辑层多处地方都会使用到,在本篇文章将会为大家一一细说. 其中前面四节是事务的基础,后面的三节是事务的重点,对事务有基础的朋友可以跳过前 ...

  6. 装饰器 转载自 http://www.cnblogs.com/huxi/archive/2011/03/01/1967600.html

    今天来讨论一下装饰器.装饰器是一个很著名的设计模式,经常被用于有切面需求的场景,较为经典的有插入日志.性能测试.事务处理等.装饰器是解决这类问题的绝佳设计,有了装饰器,我们就可以抽离出大量函数中与函数 ...

  7. 从头认识java-15.6 队列(Queue)

    这一章节我们来讨论一下队列(Queue). 1.什么是队列? 队列是一种特殊的线性表,特殊之处在于它仅仅同意在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作,和栈一样.队列是 ...

  8. jQuery EasyUI 1.4更新记录

    问题: menu:修复当删除一个menu项时.menu高度不准确. datagrid:修复当datagrid宽度太小时,fitColumns方法不能使用. 改进: 1.为easyui全部组件新增了自适 ...

  9. MFC的UI更新机制和加速键的创建

    近期在看<MFC Windows程序设计>这本书,正好看到更新菜单中的菜单项和加入菜单项的加速键这方面的内容,下面总一下总结. MFC提供的更新菜单项的机制例如以下: 通过消息映射表中的O ...

  10. DotNetBar.Bar作为容器使用的方法及Text更新原理

    DotNetBar.Bar作为容器使用的方法及Text更新原理                          老帅    一.容器用法   控件DevComponents.DotNetBar.Ba ...