Events 区分用户触发事件和代码触发事件

我有一个包含视频的组件：

现在，我想通过两种方式管理播放状态：

通过单击本机播放/暂停按钮收听可以更改的播放状态，并对其执行操作更改组件布局，通知其他组件

通过myComponent.playContent从外部手动触发播放

我不知道如何正确处理这个问题。例如，当用户单击本机视频控件时，将发送播放事件。当我手动调用myComponent.playContent（调用domVideo.play）时，播放事件也会被调度，因此如果我只听播放事件，它会被混淆或调用两次，等等

问题是这里混合了两种不同的东西

首先，可以通过用户单击本机控件来触发播放开始，在这种情况下，我希望捕获事件并使用它执行各种操作。这是典型的鼓泡，向上流动

其次，程序（通常是组件）希望以自上而下的方式触发播放，这里我想区分激发的事件，以避免将其视为用户创建的播放事件

我曾多次遇到过这个问题，例如ExtJS的tabpanels tabchange事件中的tab-change事件，我不知道如何在基于事件的编程范例中解决这个问题

我正在寻找一个通用的解决方案或正确的方法。这不仅仅是关于本机DOM事件。我有一个YT.Player一个YouTube播放器对象，它自己的事件具有相同的模型，我遇到了相同的问题

---

编辑：setTimeout和取消的一些技巧是可能的，但我想避免这种情况。

我不确定DOM的细节，但让我告诉您它在Flex/Flash Player中是如何工作的，Flex/Flash Player也是客户端、基于事件的运行时/编程模型

让我们来看一个组件C，例如，您的示例中的视频播放器和一个应用程序a——简单地说，包含您的组件的东西可以是一个子应用程序、应用程序模块等。；让我们称之为应用程序

组件的公共API如下所示：

component VideoPlayer
    function play()
    event playStateChange

eventBus.dispatchEvent("globalPlayEvent")

我将描述两种情况，一种是没有MVC框架裸骨解决方案，另一种是有MVC框架

1没有任何MVC框架

应用程序需要有一个对组件的引用，并在某处调用类似以下内容：

videoPlayer.addEventListener("playStateChange", function() {...})

如果需要在视频播放器上开始播放，它只需调用

videoPlayer.play();

简单

我不理解您在问题底部描述的问题，即为什么调用play会再次发送相同的事件-在Flex中，程序员需要显式地这样做，这可能是一个错误；当然，如果有必要，发送不同名称的事件可能是有意义的，但这是另一回事

2使用MVC框架

Flex应用程序通常相当大，具有独立屏幕、内容窗格、容器、组件等的深层嵌套层次结构。因此，应用程序直接引用应用程序中的所有组件可能不太实际

因此，MVC框架的命名不正确，但让我们把它放在一边。。。通常提供一个中央事件总线，应用程序的不同部分可以通过它进行通信。因此，有了这个框架，应用程序中任何地方的任何代码都可以执行如下操作：

component VideoPlayer
    function play()
    event playStateChange

eventBus.dispatchEvent("globalPlayEvent")

组件VideoPlayer在实例化过程中会执行以下操作：

eventBus.addEventListener("globalPlayEvent", function() {
    play();
}

相反方向的通信是类似的——组件只需在某个全局事件调度/事件总线上调度playStateChange，任何感兴趣的人都可以处理它。在这个模型中，您不依赖于我认为很好的事件冒泡

这回答了你的问题吗