javascript - 结合 DOM0 和 DOM2 事件处理程序 - 在 DOM0 处理程序中可能取消事件？

Question

请考虑以下问题:

(1) 您已将内联事件处理程序分配给 DOM 元素，例如 <a id="link1" href="..." onclick=" ... ´" >

(2) 您还可以为 onclick 分配一个或多个事件处理程序。 link1的事件使用 DOM2 或 IE 特定的分配机制。

在 Firefox 3.019 和 IE7 中经过验证的行为是:在 (1) 中分配的处理程序在 (2) 中分配的所有处理程序之前执行，以防单击。这很好(所以，可能没有任何东西写在石头上......)。但是让我们暂时依赖这种行为。

现在的问题:是否可以在 (1) 中分配的处理程序中取消将点击事件冒泡到 (2) 中分配的处理程序？

在你尖叫之前:当然，为什么不呢，请看以下内容:假设您分配 onclick="if (ready1) return true; else return loading(event);"到 link1 并将加载定义为

function loading(e) {
    // alert("Still loading functionality - sorry, slow line perhaps...");
    // no propagation
    if( e.stopPropagation ) { e.stopPropagation(); }
    e.cancelBubble = true;
    return false; // Cancel default handling
}

在上面的一些脚本标签中。这不会阻止传播(既不在 FF3.019 也不在 IE 中)到 (2) 中分配的处理程序。

感谢任何提示!

上下文(或:我为什么要这样做？):

A) 延迟/延迟加载 Javascript 以快速呈现内容。
-> 你想通知用户一些功能仍在加载(而不是简单地禁用一个 UI 元素，这不是真正的用户友好——为什么这个按钮被禁用？)。您还希望使用已经嵌入到页面中的最小 Javascript，因为首先使用附加请求加载 Javascript 库有点违背了目的(否则，您当然可以使用一种允许事件注册并保证执行顺序的已实现机制(你需要 B，见下文)

和 B) 您还希望在单个“原子”时间点“释放野兽”，即:您不想被迫整合/更改 (2) 中分配的所有处理程序以等待对于某种信号“现在你可以工作了，因为一切都已加载”，你只是想将这个信号提供给事件处理链的头部(在(1)中分配的处理程序)，然后它可以简单地开始传播对可能发生的任何事件的事件(否则，可能会发生对用户输入的部分 react ，因为某些功能已经附加而其他功能尚未附加——这可能比什么都不做更糟糕；)

Answer 1

简短回答:否。

长答案:您可以使用第一个处理程序来设置第二个(及后续)处理程序检查的变量。这是一个简单的例子

<div id="outer">
  <a id="link1" href="#" onclick="return loading();">test</a>
</div>

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">

var passCheck = false;

setTimeout( function()
{
  passCheck = true;
}, 5000 );

function loading()
{
  alert( 'a#link1 was clicked!' );
  return false;
}

$(function()
{
  $('#link1').click( function( event )
  {
    if ( !passCheck )
    {
      event.stopPropagation();
    }
  });

  $('#outer').click( function( event )
  {
    alert( 'div#outer was clicked!' );
  });
});

</script>

不过，这一切都让人觉得很老套。感觉你应该改用一些完成回调，或者应用一些 continuation passing style .