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
// The second parameter says go ahead with the default action
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);
}
};
8
如果您不想使用JQuery并且不特别关注向后兼容性,请使用
let element = document.getElementById(id);
element.dispatchEvent(new Event("change")); // or whatever the event type might be
var event; // The custom event that will be created
if (document.createEvent) {
event = document.createEvent("HTMLEvents");
event.initEvent("dataavailable", true, true);
} else {
event = document.createEventObject();
event.eventType = "dataavailable";
}
event.eventName = "dataavailable";
if (document.createEvent) {
element.dispatchEvent(event);
} else {
element.fireEvent("on" + event.eventType, event);
}
0
HTML
<a href="demoLink" id="myLink"> myLink </a>
<button onclick="fireLink(event)"> Call My Link </button>
JS
// click event listener of the link element --------------
document.getElementById('myLink').addEventListener("click", callLink);
function callLink(e) {
// code to fire
}
// function invoked by the button element ----------------
function fireLink(event) {
document.getElementById('myLink').click(); // script calls the "click" event of the link element
}
0
我只是使用了以下(似乎更简单):
element.blur();
element.focus();
在这种情况下,只有当值被真正改变时才会触发事件,正如您通过用户执行的正常聚焦轨迹触发它一样 .
274
你可以使用我编译在一起的这个功能 .
if (!Element.prototype.trigger)
{
Element.prototype.trigger = function(event)
{
var ev;
try
{
if (this.dispatchEvent && CustomEvent)
{
ev = new CustomEvent(event, {detail : event + ' fired!'});
this.dispatchEvent(ev);
}
else
{
throw "CustomEvent Not supported";
}
}
catch(e)
{
if (document.createEvent)
{
ev = document.createEvent('HTMLEvents');
ev.initEvent(event, true, true);
this.dispatchEvent(event);
}
else
{
ev = document.createEventObject();
ev.eventType = event;
this.fireEvent('on'+event.eventType, event);
}
}
}
}
触发以下事件:
var dest = document.querySelector('#mapbox-directions-destination-input');
dest.trigger('focus');
// Add an event listener
document.addEventListener("name-of-event", function(e) {
console.log(e.detail); // Prints "Example of an event"
});
// Create the event
var event = new CustomEvent("name-of-event", { "detail": "Example of an event" });
// Dispatch/Trigger/Fire the event
document.dispatchEvent(event);
document.addEventListener("my_event", function(e) {
console.log(e.detail);
});
var detail = 'Event fired';
try {
// For modern browsers except IE:
var event = new CustomEvent('my_event', {detail:detail});
} catch(err) {
// If IE 11 (or 10 or 9...?) do it this way:
// Create the event.
var event = document.createEvent('Event');
// Define that the event name is 'build'.
event.initEvent('my_event', true, true);
event.detail = detail;
}
// Dispatch/Trigger/Fire the event
document.dispatchEvent(event);
16 回答
这将imediattely触发事件'beforeinstallprompt'
你想要的是这样的:
使用jQuery,它将是这样的:
只是建议一个不需要手动调用监听器事件的替代方案:
无论您的事件监听器做什么,都将其移动到一个函数中并从事件监听器调用该函数 .
然后,您还可以在其他任何地方调用该函数,以完成事件触发时所执行的操作 .
我发现这不那么“代码密集”,更容易阅读 .
我使用JavaScript在mouseover上搜索了click click,mousedown和mouseup事件 . 我找到了Juan Mendes提供的答案 . 如需答案,请单击here .
点击here是现场演示,下面是代码:
如果您不想使用JQuery并且不特别关注向后兼容性,请使用
请参阅文档here和here .
使用jquery事件调用 . 在下面的行中写下要触发任何元素的onChange .
element_id是要触发其onChange的元素的ID .
避免使用
因为它的支持很少 . 请参阅此文档以获取support .
您可以在IE 8或更低版本上使用fireEvent,在大多数其他浏览器上使用w3c的dispatchEvent . 要创建要触发的事件,可以使用
createEvent
或createEventObject
,具体取决于浏览器 .这是一段不言自明的代码(来自原型),在
element
上触发事件dataavailable
:HTML
JS
我只是使用了以下(似乎更简单):
在这种情况下,只有当值被真正改变时才会触发事件,正如您通过用户执行的正常聚焦轨迹触发它一样 .
你可以使用我编译在一起的这个功能 .
触发以下事件:
观看活动:
希望这可以帮助!
一个工作的例子:
对于较旧的浏览器polyfill以及更复杂的示例,请参阅MDN docs .
请参阅EventTarget.dispatchEvent和CustomEvent的支持表 .
如果你使用jQuery,你可以简单地做
并处理它
其中“[arg0,arg1,...,argN]”表示这些参数是可选的 .
修改@ Dorian的answer与IE合作:
FIDDLE: https://jsfiddle.net/z6zom9d0/1/
SEE ALSO:
https://caniuse.com/#feat=customevent
如果您支持IE9,则可以使用以下内容 . 同样的概念被纳入You Might Not Need jQuery .
如果您已经在使用jQuery,那么这里是上面代码的jQuery版本 .
最有效的方法是调用直接在
addEventListener
注册的相同函数 .您还可以使用
CustomEvent
和co触发假事件 .最后一些元素如
<input type="file">
支持.click()
方法 .