JavaScript 点击事件覆盖 Flash 对象

Question

我在一个div中嵌入了一个flash视频，我在主div中添加了一个JavaScript onclick事件处理程序，但它没有捕获点击事件，哪里出了问题？

代码：

   <div id="top-box-player" onclick="alert('Hi Bananas!');">
     <object width="400" height="300">
        <param name="movie" value="general.swf">
        <embed src="./swf/general.swf" width="400" height="300">
        </embed>
     </object>
   </div>

- Pedro

---

请参见https://dev59.com/Y0XRa4cB1Zd3GeqPogxz。 - Esteban Küber

Answer 1

我在http://progproblems.blogspot.com/2009/08/javascript-onclick-for-flash-embeded.html找到了以下内容：

1. 将参数wmode设置为transparent。这样，包含Flash的对象就可以接收Javascriptonclick事件。
2. 使用onmousedown而不是onclick。尽管使用了wmode transparent，但有些浏览器仍然不会调用onclick，但它们会调用onmousedown。

代码如下：

<div onmousedown="clickBanner(1)">
<object>
<param name="movie" value="3.swf">
<param name="wmode" value="transparent" />
<embed wmode=transparent allowfullscreen="true" allowscriptaccess="always" src="3.swf"></embed>
</object>
</div>

它适合我的需求 =)

- Darwin

---

https://dev59.com/N1jUa4cB1Zd3GeqPNQR1#6276394 - Ryan Lester

感谢您！作为后续，使用mousedown的一个区别是它会被右击和左击触发，使得右击弹出Flash上下文菜单并执行单击监听器要做的事情。因此这个答案可能有助于那些想要阻止右击的人。https://dev59.com/NGkw5IYBdhLWcg3w_Pbn - heff

这很糟糕，因为闪存正在失去背景。 - baaroz

Answer 2

最好将所有SWF视为具有无限的z顺序。 Flash处于顶部，很少有什么可以阻止它。 另一方面，如果您可以访问SWF本身的代码，或者如果您可以使用另一个SWF来加载当前的SWF，则可以使用几个不同的Flash命令来访问页面的JavaScript（ExternalInterface是您最好的选择）。

//This is what your AS code should look like:
import flash.external.ExternalInterface;
import flash.events.MouseEvent;

root.addEventListener( MouseEvent.CLICK, useExternal, true );

function useExternal( event:MouseEvent):void
{
    //swfClickFunction is defined in JavaScript
    ExternalInterface.call( "swfClickFunction" );
}

Darwin提供了另一种使用onmousedown而不是onclick的替代解决方案。

- cwallenpoole

---

我在Flash中尝试使用on(release) { getURL("javascript:highlightform()"); }，效果很好！但是你的解决方案也是有效的，所以谢谢！ - Pedro

Answer 3

尝试这个简单的解决方案，用div覆盖flash并将点击事件放在顶部div上，这样flash就不会占用鼠标。

<div style="position:absolute;top:209px;left:80px;z-index:500;" id="helpvideos"> 
<div style="float:left">
<fb:swf 
    swfbgcolor="FFFFFF"  
    swfsrc='<?php echo SITE_URL;?>swf/3_sidebar.swf'  
    width='600' height='670'
    wmode="transparent"
     />
</div>
<div style="width:600px;height:670px;position:absolute;float:left;z-index:6000;" onclick="document.getElementById('helpvideos').setStyle('display','none');">&nbsp;</div>
</div>

- Tahir

Answer 4

几乎可以确定Flash不会将点击事件传播到其父级。除非您编写了Flash，否则无法做任何事情。

- Tor Haugen

Answer 5

Flash对象将始终捕获点击事件，而不会自动传递。您需要构建该功能-在Flash中捕获onclick事件并调用JS函数。

您想要实现什么目标？

- oberhamsi

---

当我们点击swf时，我正在尝试更改另一个页面对象的css类。 - Pedro

Answer 6

<param name="wmode" value="transparent" />

这对我来说是个解决方案。我在参数中实现了它在AC_RunActiveContent.js上:

'wmode', 'transparent',

太棒了！！！

- Yagarasu

Answer 7

我在尝试制作自动化动态放置横幅时遇到了这个问题。如果SWF设置为'opaquecolor'模式，那么我没有可接受的点击 - 而我必须使用opaquecolor，因为一些横幅与网站颜色混淆。我找到的解决方案是将SWF设置为“透明”模式，在z-index：10的

下面放置一个同样尺寸的新

，填充SWF的opaquecolor。将两个div都放进标签中。 这很有效。

Example:
    <a href="www.mysite.com">
    <div id="SWF_file_container" style="width:100px; height:40px; z-index:10;">
    <object> .... </object> (adding SWF in TRANSPARENT MODE)
    </div>
    <div id="opaquecolor_of_swf" style="width:100px; height:40px; z-index:2; background-color:#ff0000;"></div>
    </a>

- vkp

Answer 8

在 object 标签上绑定 onclick 事件（object 标签支持鼠标事件），然后通过 DOM 获取父级 div。

- Elijan