Javascript Change 和 Click 事件不会同时触发答案

【问题标题】：Javascript Change and Click events don't both fireJavascript Change 和 Click 事件不会同时触发
【发布时间】：2015-10-30 17:58:45
【问题描述】：

我有一个文本区域或输入，我更改了文本，然后单击链接或按钮（不关闭输入），仅触发更改事件，而不触发单击事件。我希望他们俩都开火：

Enter some text and then click the link. We want f1 and f2 to appear !
<br />
<input onchange="f1();" value="input text" />
<br />
<a href="" onclick="f2();">click me</a>


function f1() {
    alert("f1");
    return true;
}

function f2() {
    alert("f2");
    return true;
}

http://jsfiddle.net/paull3876/vrcfherp/3/

我已经用上面的 jquery 和普通 js 试过了，我在函数内部试过 setTimeouts，我试过 input 和 textarea，但不管我做什么，只有 f1 触发。

更新 1

所以我们已经确定警报会终止任何后续事件 - 很好。 Fiddle

现在的挑战是，如何将这些事件堆叠在一个对象中，以便每个事件都可以触发警报（或确认，或...）并且不会阻止任何未来的事件。我只是在尝试不同的想法。更多内容...

更新 2

我编写了一些代码来堆叠函数，然后在最后执行它们。它并不漂亮（它应该被包装在一个类中）但它可以工作：

http://jsfiddle.net/paull3876/vrcfherp/9/

【问题讨论】：

你的小提琴在 Chrome 中对我有用。
先做这个f2(e){e.preventDefault() .... }然后再解释一下，你想在f2之后按click执行f1吗？
开始停止alert()（这是模态的，因为没有触发点击事件，只有mousedown）用于调试目的jsfiddle.net/vrcfherp/4
在 Safari (9.0.2) 中也可以使用，只有 Firefox（此处为 43.0a2）的行为与 OP 中描述的一样
它在 chrome、FF 或 IE 中对我不起作用。

标签： javascript events onclick onchange

【解决方案1】：

这种行为是由于警报的阻止模式。

浏览器会一个接一个地触发事件。在这种情况下，优先级必须是

<input> 的 onChange 事件
<a> 的 onClick 事件

但是当它第一次执行输入的onChange时，它会遇到alert，它会阻塞其余的东西，因此不会触发锚标记的onClick事件。

如果您从警报更改为console.log，请检查this

【讨论】：

谢谢，在我的应用程序中没有警报，但我看到相同的行为“阻止模式”评论可能是原因。我正在尝试一些事情并会更新..谢谢
这里有一个小提琴来确认它在没有警报的情况下工作：jsfiddle.net/paull3876/vrcfherp/7
好。补充一点，当警报弹出时，即使我们也无法滚动浏览器窗口。无论如何，这个问题引起了很多关注。 :)
这真的很痛苦，因为在某些情况下我需要在第一个事件中向用户弹出一个问题。我仍然希望第二个事件点击触发，但它没有。我想我将不得不使用超时
我不确定超时是否会对您有所帮助，因为不会生成事件本身。可能会再次设计，例如在 onClick 和 onChange 中包含的内容可能会解决问题。这取决于。您已更新您的问题，但您无法堆叠/收集根本未生成的事件。

【解决方案2】：

alert() 是模态的，因为input 失去了对其他元素 mousedown 的关注，所以没有触发点击事件。

所以开始使用console 进行调试。

【讨论】：