JS与AS3.0的交互

首先，写这么一篇博文，是因为发现关于AS3.0与网页交互的文章实在太少了。所以，经过自己实践和研究，就整理了一份出来，希望大家可以相互学习相互补充，共同进步。

（注意：一切案例必须在Apache里运行。不经过服务器直接读网页无法实现效果！！！）

1、首先，在网页中添加FLASH的方法有很多种。可是往往通过设计常用软件DW直接添加的<object>标签里会带有很多乱七八糟的代码，以及几个非常长的JS。其实这些都是不必要的。于是我们来记一个最简单的添加FLASH的代码（比如我们要加的FLASH是名字是bigface.swf）：

<objectclassid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"id="myFlash" width="400" height="180"  align="middle">

    <paramname="allowScriptAccess" value="sameDomain" />

    <param name="movie"value="bigface.swf）" />

    <param name="quality"value="high" />

    <embed

     src="bigface.swf）"

     width="400"

     height="180"

     quality="high"

     swLiveConnect=true

     name="myFlash"

     align="middle"

     allowScriptAccess="sameDomain"

     type="application/x-shockwave-flash"

    pluginspage="http://www.macromedia.com/go/getflashplayer"/>

</object>

 

在这些标签中，红色标注的标签是为我们做交互必须写入的标签。

 

2.AS调用JS方法

AS调用JS的方法是很简单的。首先我们在插入FLASH之后，写下我们想要让AS调用的JS方法。

比如我们想做一个案例（案例1），是一个希望在FLASH输入什么，只要一点击，就让网页里alert()出来什么。

首先，我得在网页中插入bigface.swf（按照第一步讲的）。

然后我们在JS里写下如下代码：

<scripttype="text/javascript">

       functiontell(text){

              alert(text);

              }

</script>

这是个很简单的弹出框语句。如果能让FLASH调用到这个语句，并且把要传递的数值传出来就成功了。

 

接着，我们在FLASH里做下面事情：

建立一个输入框，取名mytext;

建立一个按钮，取名btn;

然后写下下面的AS：

btn.addEventListener(MouseEvent.CLICK,sendout);

function sendout(event:MouseEvent):void{

      ExternalInterface.call("tell",mytext.text)

      }

 

这里具体讲解一下

我们给按钮btn添加了一个鼠标监听事件，事件类型是鼠标点击，触发后执行sendout这个函数。这个函数里的命令就是ExternalInterface.call("tell",mytext.text)，调用外部（也就是JS里的）tell这个函数，赋予的参数就是我们输入框里的文字mytext.text。

然后重新输出一遍FLASH，我们的案例就完成了。

 

2、JS调用AS

我们同样首先载入一个叫bigface.swf的FLASH

我们在FLASH里只加一个叫mytext的文本框。

然后我们在网页中写下一下网页标签：

</br>

</br>

<input type="text"id="shuru" />

<button type="button"id="enter">点击</button>

之后我们先到AS里写下：

function putin(thetext:String):void{

      mytext.text =thetext;

      }

ExternalInterface.addCallback("sendtxt",putin)

写完后，网页中修改并加入JS如下：

<input type="text" id="shuru"/>

<button type="button" id="enter"onclick="sendin()">点击</button>

<script type="text/javascript">

      functionsendin(){

             var t = document.getElementById("shuru").value;

             window.document.myFlash.sendtxt(t); 

             }

</script>

这样我们就实现了JS调用AS的函数并达到了传值。

 

（最后，看不明白的童鞋，我发一个做好的案例打包。一定要放到服务器中查看，本地的Apache就可以哦。）