博瑞博客

青春是一个充满活力的季节，即便是我们失去了天使的翅膀，只要我们还有一颗青春的心，那么我们的生活依然能够如阳光般灿烂！......
推荐阅读站长精心推荐阅读
现在位置：首页 >
  • JS与AS3.0的交互

    JS与AS3.0的交互

    Javascript  10-3  647浏览  0评论  

    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"οnclick="sendin()">点击</button> <script type="text/javascript">        functionsendin(){               var t = document.getElementById("shuru").value;               window.document.myFlash.sendtxt(t);                } </script> 这样我们就实现了JS调用AS的函数并达到了传值。

  • javascript与as3交互

    javascript与as3交互

    Javascript  10-3  790浏览  0评论  

    模拟事件 在as3中,无论是调用js的方法,还是暴露接口给js,都是用ExternalInterface这个api. 暴露接口:ExternalInterface.addCallback(函数名, 函数) 调用js方法:ExternalInterface.call(方法名, 参数) 这里所说的模拟事件,就是在falsh素材的各个状态切换时,通知页面.如加载完毕时,触发onload事件,播放时触发onplay,停止时触发onstop等等. 采用的方案,是在object标签里,添加自定义的属性供as3调用,属性名是flash定死的:flashvars,值的格式类似url里的参数部分,为用&分隔的键值对,如下: 01 在as3中,这样读取属性: flashvars= LoaderInfo( this.root.loaderInfo ).parameters; flashvars是一个object变量,定义如下: private var flashvars:Object; 读取后,flashvars的值: Object {onload: "advnr70wyu5xncanvpwzzo0pory66", onplay: "advf4q8r99cfnryhn2tk2n3s48kf0", onstop: "adv7sgjk0529cd00q6ojuf537"} 对象的key为事件名,值为事件处理函数名,所有事件处理函数都在window.flashCallback命名空间下,并且名字是随机生成的不可重复的guid. 在as3里,我们判断是否支持调用js函数: ExternalInterface.available 以onload事件为例,在素材加载完毕后,如果支持调用js函数,则触发onload事件: //素材加载完毕,调用onload private function onload():void {    if (ExternalInterface.available) {        textField.text = 'onload';        if(flashvars.onload){            ExternalInterface.call("window.flashCallback." + flashvars.onload);        }    } } 上面提到,函数名是随机生成的,类似jquery的$.ajax方法里的callback实现方式,以下是封装过的生成object标签的方法: //adv.flash.embed是封装过的生成object标签的方法 asyncTest('flash标签自定义事件', function () {  expect(3);  document.body.appendChild(adv.flash.embed({    id: 'flashGetSWF',    source: 'test.swf',    params: {      onload: function () {        this.play();        ok(true);      },      onplay: function () {        ok(true);        this.stop();      },      onstop: function () {        ok(true);        start();      }    }  })); }); 几个回调函数都是匿名函数,在生成标签之前,会给函数在window.flashCallback下分配一个随机名称.现在只是简单的实现单个事件处理函数的绑定,如果有需要支持多个,只要再做一些简单的封装即可. adv.flash.embed的实现要点: //遍历自定义参数 adv.util.forEach(params, function (value, key) {  var funcVar = value;  if (adv.util.isFunction(value)) {    //如果是函数,则生成一个随机的名称,并存储在flashCallback命名空间下    funcVar = adv.util.guid();    window.flashCallback[funcVar] = function() {      var swfObj = adv.flash.getSWF(id);      //this指向flash对象本身      value.apply(swfObj, arguments);    };  }  paramArr.push(key + '=' + funcVar); }); 执行结果: 02 暴露接口给js as3里,实现这个很简单,先上代码再说: public function test() {    flashvars= LoaderInfo( this.root.loaderInfo ).parameters;    //此为调试用    ExternalInterface.call("window.flashCallback.trace",flashvars);    //加载素材    textField.width=200;    textField.height = 90;    addChild(textField);    //素材加载完毕,准备播放    //暴露api给js    if(ExternalInterface.available){        ExternalInterface.addCallback("play", play);        ExternalInterface.addCallback("stop", stop);    }    //触发onload    onload(); } //这个方法被调用时,开始播放 private function play():Boolean {    textField.text = 'play';    if(flashvars.onplay){        ExternalInterface.call("window.flashCallback." + flashvars.onplay);    }    return true; } //这个方法被调用时,停止播放 private function stop():Boolean {    textField.text = 'stop';    if(flashvars.onstop){        ExternalInterface.call("window.flashCallback." + flashvars.onstop,flashvars);    }    return true; } 这里定义了两个方法,play和stop,在构造函数(test)里,判断ExternalInterface是否可用,如果可用,就暴露出这两个方法: ExternalInterface.addCallback("play", play); ExternalInterface.addCallback("stop", stop); 在js里调用: 跨浏览器的获取flash对象引用方法 ... getSWF:function(name) {  if (navigator.appName.indexOf("Microsoft") != -1) {    return window[name];  } else {    return document[name];  } } ... 暴露出的as3方法,会直接附加在object对象上,要注意的是,我们要等onload之后才去调用,保证falsh加载完毕: asyncTest('js调用flash方法', function () {  expect(1);  document.body.appendChild(adv.flash.embed({    id: 'flashcallSWF',    source: 'test.swf',    width: 300,    height: 190,    params: {      onload: function () {        var result = this.play();        ok(result);        start();      }    }  })); }); 事件函数的this指向flash对象,所以这里不用再获取了 执行结果: 03 完整的as3代码: package {    import flash.display.LoaderInfo;    import flash.display.Sprite;    import flash.external.ExternalInterface;    import flash.text.TextField;    public class test extends Sprite {        private var flashvars:Object;        //用textField文本的改变来代表广告播放的状态转变        private var textField:TextField = new TextField();        public function test() {            flashvars= LoaderInfo( this.root.loaderInfo ).parameters;            //加载素材            textField.width=200;            textField.height = 90;            addChild(textField);            //素材加载完毕,准备播放            //暴露api给js            if(ExternalInterface.available){                ExternalInterface.addCallback("play", play);                ExternalInterface.addCallback("stop", stop);            }            //触发onload            onload();        }        //这个方法被调用时,开始播放        private function play():Boolean {            textField.text = 'play';            if(flashvars.onplay){                ExternalInterface.call("window.flashCallback." + flashvars.onplay);            }            return true;        }        //这个方法被调用时,停止播放        private function stop():Boolean {            textField.text = 'stop';            if(flashvars.onstop){                ExternalInterface.call("window.flashCallback." + flashvars.onstop,flashvars);            }            return true;        }        private function onload():void {            if (ExternalInterface.available) {                textField.text = 'onload';                if(flashvars.onload){                    ExternalInterface.call("window.flashCallback." + flashvars.onload);                }            }        }    } }

分类

随机文章

最新评论

标签

关于我们 | 订阅本站 | 雁过留声 | 联系站长 | 网站地图 | 友情链接

Copyright © 2025 博瑞博客 本站使用主机

黑ICP备15002916号 SiteMap