给flash加onclick事件

来源：互联网发布：看股市行情的软件编辑：程序博客网时间：2024/05/17 06:51

需求：onclick flash,异步请求php脚本。

结果：发现直接在<object onclick="clickme()">触发不了，接着就想在外面套一层<div onclick="clickme()"></div> , 发现只能在FF下能触发click事件，于是是搜索了一下，找到两个解决方法

搜索了下，找到了一些方法，但那些方法是说其他浏览器的，用一个button包住flash

在Chrome中 embed不支持onclick，但支持onmouseover，onmousedown，onmouseup

就利用这几个方法，自己拼凑一个click事件：

设置一个变量click
over的时候 +1
down的时候 +2
up 的时候 +4
out的时候清零
发生up的时候，检查click变量，如果是7，那就是click事件了

<div style="border:1px #f00 solid; width:486px">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="flash_obj" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="468" height="60">
<param name="movie" value="http://static.googleadsserving.cn/pagead/imgad?id=CICAgICQjvvjThDUAxg8MgiCYoyW5NzeKQ">
<param name="quality" value="high">
<param name="AllowScriptAccess" value="never">
<param name="wmode" value="opaque">
<param name="FlashVars" value="">
<embed src="http://static.googleadsserving.cn/pagead/imgad?id=CICAgICQjvvjThDUAxg8MgiCYoyW5NzeKQ" id="flash_embed" width="468" height="60" wmode="opaque" flashvars="" type="application/x-shockwave-flash" allowscriptaccess="never" pluginspage="http://www.macromedia.com/go/getflashplayer" >
</object>
</div>

<script>
if(!console){
console = { log: function(){} };
}
var timeoutID,
    c = 0,
    flashObj = document.getElementById('flash_obj'),
    flashEmbed = document.getElementById('flash_embed');
function over(){
c |= 1;
console.log('mouse over', c);
}
function out(){
c = 0;
console.log('mouse out', c);
}
function down(){
c |= 2;
console.log('mouse down', c);
}
function up(){
c |= 4;
console.log('mouse up', c);
if(c === 7){
    click();
    c |= 8;
    if(! timeoutID){
      console.log('avoid twice click', c);
      timeoutID = setTimeout(function(){
        c ^= 8; //异或，a ^ b， ab不同则返回1
        console.log('resume click', c);
        timeoutID = undefined;
      },100);
    }
}
}
function click(){
console.log('trigger click', c);
alert('click');
}
if(flashObj){
flashObj.onmouseover = over;
flashObj.onmouseout = out;
flashObj.onmousedown = down;
flashObj.onmouseup = up;
}
if(flashEmbed){
flashEmbed.onmouseover = over;
flashEmbed.onmouseout = out;
flashEmbed.onmousedown = down;
flashEmbed.onmouseup = up;
}
</script>

2.最近在做一个项目，是一个银行的自助服务软件，需要在闲暇时间全屏播放广告，支持图片和flash方式，并且在用户触摸屏幕或按键时能够跳转到服务界面，图片当然相当简单，给它定义一个onclick事件即可，但是flash就犯愁了，点击flash时javascript根本没有办法捕捉到鼠标事件，这可如何是好？
    试验了一阵，给出两个方法，供大家选择。
    两种方法的前面都一样：
    <div style="position:absolute; left:0px; top:0px; width:800px; height:600px;    z-index:-1">
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="800" height="600">
    <param name="movie" value="media.swf">
    <param name="quality" value="high">
    <param name="wmode" value="transparent">
    <embed src="media.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="200" height="115"></embed>
</object> </div>
    这是flash的显示，主要为红色字体地方，flash的显示级别比较高，必须将它设置为底层显示；显示方式也必须设置为透明，否则也没有效果（不管是方法一还是方法二）。
    方法1：
    用photoshop做一个空的图片，里面没有任何内容，如kong.gif，覆盖到flash上方。
   <div id=gg1 style="position:absolute; left:0px; top:0px; width:800px; height:600px;    z-index:1">
      <img onClick="toantherUrl()" src="kong.gif"/>
   </div>
   方法2：
    任意加一张图片，但是要设置其透明度为0，即该图片确实存在，但是把它透明化，不让用户看到（与方法1异曲同工）
   <div id=gg1 style="position:absolute; left:0px; top:0px; width:800px; height:600px;    z-index:1; filter:Alpha(Opacity=0)">
      <img onClick="toantherUrl()" src="any.jpg"/>
   </div>
   这样flash能够正常显示，鼠标事件也能够正常响应，当然，看起来像是点击了flash，其实点击的覆盖在上面的图片，曲线救国，呵呵
  两种方法都是使用了另外一张图片来实现flash的点击事件，需要注意的地方是：
   flash必须设置参数wmode为transparent；
   图片要覆盖在flash的上方；
   不管是方法1还是方法2都必须使图片透明化，不遮盖flash。

上面两个实例来自于：http://www.cnblogs.com/arliang/archive/2011/12/08/Flash_Click_Event_In_Chrome.html

http://hi.baidu.com/2471615/blog/item/1dd4c5174ed5a80fc83d6d20.html