JS和AS交互

这个话题在网上应该说很好找,有很多这方面的资料。比者也看过一些,不过大部分都是AS2与JS进行交互。很少提到AS3,即使有,也让人感觉浅尝辄止。很多东西并没有介绍的太清楚。所有笔者萌生了写这样一篇教程的想法!

提及AS3与外部脚本的交互,笔者认为可以总结成两种。一是AS3调用外部函数,二是外部脚本调用AS3函数。无外乎就这两种。在调用函数的同时,我们还可以向函数传递一些参数。这就达到了传递数据的目的。举一个最简单的例子。我们平时在网络上看视频的时候,这些用AS3制作的播放器就是由外部脚本(可能是JS,也可能是ASP或其他脚本)传递给它的视频地址。从而就简化我们的后台程序。有的人会问!你用播放器去读取外部的XML数据不是也可以吗?确实,当时,当你有成千上万个视频的时候,你不可能输入这么多数据。一是比较麻烦,二来是影响了网页运行的速度。所以,AS3与外部脚本进行交互是非常重要的。

其实,我们做的绝大多数带有交互性的FLASH程序都要多多少少与后台的其他语言进行交互。这里,我们就以JS脚本来举例说明交互的过程。当然,AS3与JS脚本可以说有血缘关系,具体的大家可以去查看一下FLASH的发展历史。好了!废话不多说,我们这就开始讲如何让JS与AS3进行一些信息的交换。本节中,我们只讲解JS调用AS3中的函数。反向的调用我们将在下一节中进行讲解!

首先,我们新建一个FLASH文档,然后在舞台上绘制一个动态文本,该文本的实例名称为wen_txt。好了!美工的部分就算完成了(我们这里是一个非常简单的实例,不要求太复杂。力求突出重点)!

现在,我们要在FLASH中建立一个允许被外部调用的函数。那么如何去建立声明这样一个函数呢?我们要使用到一个类,这个类的名字就是ExternalInterface。很多人都没有太注意过这个类。这个类实际上是在flash.external 包中。这个包是专门用来和外部容器进行通信的。那么对这个ExternalInterface类,它的官方解释是“ExternalInterface 类是外部 API,在 ActionScript 和 Flash Player 的容器之间实现直接通讯的应用程序编程接口,例如,含有 JavaScript 的 HTML 页。”很显然,这里已经提到了JS。好了!下面我们就来写一下脚本吧!如下:

ExternalInterface.addCallback("abcd",yun);
function yun(zi:String):void{
wen_txt.text = zi;
}

我们看,建立一个可以被外部调用的函数实际上就是使用了 ExternalInterface类的addCallback方法。我们可以从宏观上这样理解。但实际上它的真正作用是将一个函数注册为可从容器调用。实际上我们的FLASH端就这么简单。好了!保存文件,发布。注意!这里,我发布出来的SWF文件的文件名是ab.swf。

上面我们已经将FLASH端的脚本写好了,下面我们来编写JS代码,其实也是一个HTML网页代码,这个HTML代码中包含JS代码!如下:

<!-- saved from url=(0014)about:internet -->
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FLASH与JS交互</title>
<script language="JavaScript">
     function pageInit() { 
        sendToActionScript("你好");
     }
     function sendToActionScript(value) { 
         window.ExternalInterfaceExample.abcd(value);
     }
</script>
</head>
<body >
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
             id="ExternalInterfaceExample" width="500" height="500"
             >
         <param name="movie" value="ab.swf" /> 
     </object>
</body>
</html>

好了!现在将这个网页保存到和ab.swf同一文件夹下,然后运行这个网页。当程序运行的时候,我们就可以看到FLASH中的动态文本会出现“你好”字样!这个过程就是JS调用AS3函数,同时向FLASH传递了一个参数,或者说传递了一组数据。

关于这段JS代码,我们就不多说了。因为涉及到很多JS脚本的只是。大家可以在网上查找相关的资料,就可以明白这段JS脚本的含义了!

本节我们就讲解到这里,下一节我们讲解,FLASH如何向JS传递参数!

书接上文,上次我们讲到JS向FLASH传递参数。本节我们来讲解FLASH向JS传递参数。

先说说原理吧。实际上我们所浏览的每一个网页都可以看作是一个容器。那何为容器呢?说白了就是一个盒子。在这个盒子里面放着许多东西,包括网页中的文字,图片,FLASH,脚本,按钮,文本框等。所以,我们的 FLASH如果想访问网页中的JS函数,实际上就是访问上一级中的函数。这种操作相对就要简单一些。因为我们的JS函数对网页中的成员都是公开的,这个网页中的任何元素都能够调用这个JS函数。同样,FLASH也拥有这样的权限。那么好了!我们来看看在网页中具体是怎样做的。

我们这次先来写网页代码,因为网页这边是接受端。代码如下:

<!-- saved from url=(0014)about:internet -->
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FLASH与JS交互</title>
<script language="JavaScript">
     function sendToJavaScript(value) {
         document.forms["form1"].output.value += "\n" + "ActionScript says: " + value;
     }
</script>
</head>
<body>
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
             id="ExternalInterfaceExample" width="500" height="500"
             >
         <param name="movie" value="ab.swf" /> 
     </object>
     <form name="form1" onsubmit="return false;">
         <textarea cols="60" rows="20" name="output" readonly="true">Initializing...</textarea>
     </form>
</body>
</html>

具体的什么意思笔者在这里就不多说了,属于JS方面的知识,大家可以去查看相关资料。好了下面就是FLASH端的代码了!我们先来做美工界面。画一个输入文本,实例名为wen_txt,再做一个影片剪辑元件,实例名为 an_mc。好了!美工部分做完了!我们来写脚本。如下:

an_mc.addEventListener(MouseEvent.CLICK,chuan);
function chuan(evt:Event):void {
ExternalInterface.call("sendToJavaScript", wen_txt.text);
}

我们看,其实在FLASH中调用外部的JS函数还是用到了ExternalInterface类。而这次我们是使用的call方法。

好了!运行网页,我们在FLASH的输入文本中输入一串文字,然后按一下按钮。之后这段文字就会出现在网页的文本框里面!

大家可以自己动手做一次,体会一下FLASH向JS传递参数的过程!

js与as3相互通信、调用问题

(

这几天在学FLASH的AS3编程,觉得挺有意思的。以前觉得FLASH与AS3的相互调用很神奇,现在一看,还是挺简单的,吧代码贴上来。

AS代码:

import flash.external.ExternalInterface;

ExternalInterface.call("jscall",‘abc‘); //as调用JS方法,jscall为js的函数名,后面的为参数,可以传递多个参数

txt.text = ‘text2‘;

ExternalInterface.addCallback("jscallfun",getASFun); //提供给JS调用的AS方法

function getASFun(value:String):void {

txt.text = value;

}

HTML部分:

<script language="javascript">

function thisMovie(movieName)

{

if (navigator.appName.indexOf("Microsoft") != -1)

{

return window[movieName];

}

else

{

return document[movieName];

}

}

window.onload = function(){ //此行代码必不可少,如果不用此事件,由于打开页面后,FLASH加载需要时间,可能FLASH还没有加载进来就已经执行到此函数了,从而导致调用失败

thisMovie("FlashID").jscallfun(‘中国‘);

}

//alert(thisMovie("FlashID"));

function jscall(str)

{

alert(str);

}

</script>

<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="800">

<param name="movie" value="test1.swf" />

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

<param name="swfversion" value="8.0.35.0" />

<param name="allowScriptAccess" value="always" />

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

<embed src="test1.swf" quality="high" wmode="transparent" width="800" height="800" name="FlashID" align="middle" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"/>

</object>

网页JS调用FLASH 小教程

在网页上用JS调用FLASH程序,比如一个视频网站,按照动态服务器程序产生一个URL,点击后,可以在预先制作完成的FLASH 播放器来播放.这次的小教程,只是简单的讲下,用JS调用AS程序,其实FLASH 8在这方面的资料很多.突然发现,从FLASH 2004到FLASH 8,FLASH资料多了很多啊.不过我们这次是说FLASH CS3,于时俱进嘛.

首先,我们先打开FLASH制作接受端口程序来监听JS发送的事件:(我们这次的目的是发送一组字符,很简单的,如果往复杂了做,也是同样的道理)

在FLASH CS3舞台上随便放个动态文本,把实例命名:astxt.接着输入代码:

//用ExternalInterface.addCallback来接受网页上用JS写的JsFunction程序,而beCalled是说明FLASH在

//接收到JS的时候,所发生的事件.

ExternalInterface.addCallback("JsFunction",beCalled);

//txtVar是从JS程序传送过来的变量.

function beCalled(txtVar):void {

astxt.text = txtVar;

}

下面是在网页中写的代码,为了简化代码,我这里就写主要的几个地方.首先在FLASH下面插入一个

<div>

<form name="jsForm">

<input type="text" size="10" value="你好" name="texts"></input>

<input type="button" value="点我啊"

<!-- 下面的代码就是点击网页上的代码后,所调用的程序,注意这个程序叫"callAS3"是放在

<head></head>之内的.document.jsForm.texts.value就是需要传递的变量

-->

onclick="callAS3(document.jsForm.texts.value)">

</form>

</div>

在之内写上网页按钮点击后所调用的程序.

<script language="javascript" type="text/javascript">

function callAS3(varText){

if(navigator.appName.indexOf("Microsoft") != -1){

//你们可看到JsFunction就是FLASH程序里监听的程序.而JsToAs就是我产生

//的SWF的名字,varText那就是变量参数拉.

JsToAs.JsFunction(varText);

}

else{

window.document.JsToAs.JsFunction(varText);

}

}

</script>

看,这就完成了用JS来调用FLASH.你可以在网页里的input里写入几个字符,点击按钮后,FLASH里的TEXT里就会出现你在网页上所输入的字符.

---------------------------------------------------------------------------

反过来,如何用FLASH里的程序调用JS呢?也简单在刚才的FLASH里继续写.

//在舞台上放一个Button,命名为:btn.

btn.addEventListener(MouseEvent.CLICK, clickHandler);

function clickHandler(e:MouseEvent):void {

//asFunction就是我们要在网页里写的程序.

ExternalInterface.call("asFunction","哈哈,我是来自FLASH");

}

//按钮点击后,就会把"哈哈,我是来自FLASH"这句话传递到网页里.你可以在网页里建立一个TEXT来接收

//这个参数.;

[code]

在网页里的<body></body>之内写上

<form name="form2">

<input type="text" size="10" name="accept"></input>

</form>

在网页的<head></head>里写上

<script language="javascript" type="text/javascript">

function asFunction(varText) {

document.form2.accept.value= varText;

}

</script>

OK,这样网页 就可以从FLASH接受参数,或者由FLASH来调用外部的JS.

JS到AS,和AS到JS,基本也就这样了,这些都是最基础的东西.由于一边写一边调试的。估计有错误,如果你试了,有问题,可以告诉我

时间: 2024-10-23 05:21:58

JS和AS交互的相关文章

UIWebView与JS的深度交互

事情的起因还是因为项目需求驱动.折腾了两天,由于之前没有UIWebView与JS交互的经历,并且觉得这次在功能上有一定的创造性,特此留下一点文字,方便日后回顾. 我要实现这样一个需求:按照本地的CSS文件展示一串网络获取的带HTML格式的只有body部分的文本,需要自己拼写完整的HTML.除此之外,还需要禁用获取的HTML文本中自带的 < img > 标签自动加载,并把下载图片的操作放在native端来处理,并通过JS将图片在Cache中的地址返回给UIWebview. 之所以要把图片操作放在

转载 【iOS开发】网页JS与OC交互(JavaScriptCore) OC -----&gt;JS

目标 本文介绍利用苹果在iOS7时发布的JavaScriptCore.framework框架进行js与OC的交互.我们想要达到的目标是: OC调用网页上的js方法 网页js调用APP中的OC方法 JavaSciptCore.framework框架介绍 JavaScriptCore是webkit的一个重要组成部分,主要是对js进行解析和提供执行环境.具体介绍请看这篇简书的文章:JavaScriptCore 使用 准备环境 创建一个名为JS与OC交互Demo的iOS工程.然后在storyboard添

UIWebView与JS的深度交互-b

要实现这样一个需求:按照本地的CSS文件展示一串网络获取的带HTML格式的只有body部分的文本,需要自己拼写完整的 HTML.除此之外,还需要禁用获取的HTML文本中自带的 < img >  标签自动加载,并把下载图片的操作放在native端来处理,并通过JS将图片在Cache中的地址返回给UIWebview.之所以要把图片操作放在native端做的好处在于:1.可以进行本地缓存,下次进入这篇文章可以直接从缓存读取,提高响应速度并且节省用户流量.2.可以实现点击图片放大.保存图片到相册等操作

ASP.net与SQLite数据库通过js和ashx交互(连接和操作)

ASP.net与SQLite数据库通过js和ashx交互(连接和操作): 废话(也是思路):用的是VS2010,打算做网站前后台.由于不喜欢前台语言里加些与html和css和js的其他内容,想实现前后台语言的分离,与前后台通过js的ajax实现交互,故很多百度出来的方法不成立,虽听说ashx过时,但是他实现了我要的效果:即前后台语言不是相互嵌入实现交互,而是通过js实现(有接口就可以).由于领导指定用SQLite,故这两天还折腾了SQLite,不过对于这种小型的网站,它是个很好的选择(不需要部署

js与as3交互的问题

我想,是时候纠正一定以来的误区了,那就是html中的js如何获取flash的swf对象,并与as3交互. 按照官方的写法应该是在 Internet Explorer 中返回 object 标签的 id 属性,或者在 Netscape 中返回 embed 标签的 name 属性(AS3 API手册). function thisMovie(movieName) { if (navigator.appName.indexOf("Microsoft") != -1) { return win

Js与OC交互

Js与OC交互 源码请点击github地址下载. 下面讲述实现OC和JS的交互,它们相互调用,其中需要写一个静态的HTML文件用于提供JS方法. 效果图如下: screen.png 一.OC调用JS: 不说闲话,看代码如下 需要先在js文件定义方法postStr供oc调用 function postStr(string) { return 'I am the return parameter JS, and param ' + string; } oc代码只需一句即可调用 NSString *s

前端页面js与flash交互——js获取flash对象,并传递参数

背景介绍: 最近在搞一个项目,涉及到图片选取,裁剪,上传等,由于浏览器安全性问题,js无法获取到<input type="file">中选取的文件路径,而且对照片的裁剪,抠图等由HTML5实现的功能,对各大浏览器的兼容性,真是不敢太大胆.这个时候就引进了flash,然后所有js做不了的让flash来做,然后由js来控制页面元素.就这样开始了js与as的交互之旅,听做flash的大叔说,flash调js的函数式很好调的,而js调as不大容易.最终的情况是as调js错误层出不穷

js与C++交互

转载:http://zhidao.baidu.com/link?url=LLuWzwMmpfVcQeSGv1CrAfRXpnZaetm9xypqwMW6zxLhhKES-rITAsG0-Ku-bSMAc2nVoSFk1tOJ0biPcQIoHK 1.手动点击网页按钮C++后台响应 2.设置自动触发事件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/

史上最全的 UIWebview 的 JS 与 OC 交互

来源:伯乐在线 - 键盘风筝 链接:http://ios.jobbole.com/89330/ 点击 → 申请加入伯乐在线专栏作者 其实一直想给大家整理一下JS与OC的交互,但是没有合适的机会,今天借着微信小应用的发布,以及以后H5必定越来越流行,所以给大家整理一下. 交互方式有三种: 1.UIWebviewDelegate 2.JavaScriptCore 3.WebViewJavascriptBridge按照排序给大家介绍一下,我推荐前两种方法,第三种需要依赖第三方框架,并且不一定能拦截成功

JS&amp;iOS原生交互

关于原生和hybid之争,这里不做探讨.主要讲讲JS和OC交互 开讲前附上一个牛逼的第三方 JavascriptBridge OC执行JS代码 1.stringByEvaluatingJavaScriptFromString 这个方法是UIWebView里面的方法,也是最为简单的和JS交互的方式 - (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script; 用法比较简单,一般在代理方法- (vo