如何判断用户是否点击了video元素或其中一个video控件？
题
拥有带controls的html5 video元素，例如：
并为其分配了一个点击处理程序：
$('.media.video').on('click', function (event) { /* ... */ });
如果用户只是单击video元素或其中一个控件，是否可以在处理程序方法内部确定？
没有找到关于这个的文档，并搜索了事件对象的线索，但没有成功。
我的替代方案：
- 将所有侦听器分配给video，并根据video更改事件确定是否已对控制元素或video进行了点击 – 太麻烦和不干净 。
- 使用自定义控件UI，默认为禁用 – 如果没有我的问题的答案，我会使用它 。
如果用户只是单击video元素或其中一个控件，是否可以在处理程序方法内部确定？
不，控件被视为video元素本身的一部分，因为它们是由浏览器在内部提供的。 因此，单击该元素将仅注册该元素，而不是子元素。
您可以使用您的＃1点来收听与单击控件相对应的各种命令事件。 IMO我推荐的正确方法。
如果您只需要确定video上是否有点击，您可能会做一个简单的高度检查，但控件的布局/外观可能会“下周”更改并强制进行浏览器版本检查以获得准确的高度，这是走向错误的方向。
但是，例如，在click / mousedown或mouseup的事件处理程序中：
var rect = videoElement.getBoundingClientRect(), // get abs. position of element ctrlHeight = 40, // a guess of ctrl area height y = event.clientY - rect.top; // relative y pos. to video el if (y >= rect.height - ctrlHeight) {...in ctrl area...}
另一种方法，但更多的工作，是提供你自己的控件，如你的观点＃2。 既可以是按钮，也可以是图像和图像的forms，甚至可以将它们渲染到canvas上。 这使您可以完全控制放置，外观等。
你可能会得到与第一种方法相同数量的事件处理程序，因为你需要听取每个按钮的事件而不是……