触发事件和页面更新同时发生时会发生什么？
鉴于我有这样的HTML：
Google.com 和Javascript这样：
$('#google').on('click', function (e) { console.log("Click Click Bang Bang!"); });
当我点击我的google链接时， click事件将触发，页面会立即加载下一个链接…
如果在点击事件完成之前加载目标url（google.com）会怎样？ 如果事件只是触发并完成而不管可查看的页面更新/更改URL /等，那就太棒了！ 但如果不是这样，您如何确保您的click事件完成？
谢谢！
console.log是synchronous调用，并且在完成click事件后重定向页面。 如果您在click事件中有asynchronous调用，那么您必须注意在离开页面之前必须等待响应。
除此之外还有一点点（很多）。
首先，你应该真正了解事件冒泡。
也就是说，只要元素找到“click”事件，就会将“click”事件处理程序设置为运行。
这意味着给予该对象的任何处理程序都将在元素告诉其父级之前运行（谁将告诉他们的父级，一直打开，直到你到达页面顶部）。
切换页面发生在根元素（ 或document.documentElement ）。
所以在同一事件中， a.onclick = function () { }; 将始终发生在window.onclick = function () { }; 处理程序，因为冒泡。
然而 ，这只是开始划伤表面……
如果你在点击处理程序中运行异步操作，并且点击链接，浏览器将更改页面，那么所有异步内容（服务器调用/图像加载/脚本加载/等） ）一旦浏览器到达"unload"阶段（稍后更多），将被忽略（或取消）。
你需要同步你正在做的事情（保存到document.cookie或localStorage ，而不是进行AJAX调用，等等），或者手动阻止告诉其父母发生了什么，使用.stopPropagation()事件对象，传递给事件处理程序。
当然，既然它没有告诉它的父母，它永远不会到达window ，所以页面永远不会改变……
…所以现在，在你的处理程序中，如果你想要改变页面，在完成异步内容后，你必须通过设置window.location = googleEl.href;手动进行页面更改window.location = googleEl.href; ，确定所有异步工作完成后再这样做。
…当然，这不是它的结束……当浏览器确实想要更改页面时，它还会触发"beforeunload"事件，以及可以从window监听的"unload"事件。 同样，相同的异步规则适用…
为了让事情变得更加混乱，只有大多数浏览器才会"beforeunload" ，有些人不会打扰。
所以回答你的确切问题：
点击处理程序首先触发，然后触发一些事件，然后"beforeunload" ，然后"unload" ，然后页面发生变化。
我建议点击后重定向通过锚点。 因此：
$('#google').on('click', function (e) { console.log("Click Click Bang Bang!"); //This would stop from redirecting e.preventDefault(); //This will take you to Google after completing the above task window.location.reload = "http://google.com"; });