Actionscript与javascript交互实例程序(修改)


Posted in Javascript onSeptember 22, 2016

mxml页面:

<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" 
width="100%" height="100%" xmlns:code="http://code.google.com/p/flex-iframe/" 
creationComplete="initApp()"> 
<fx:Declarations> 
<!-- 将非可视元素(例如服务、值对象)放在此处 --> 
</fx:Declarations> 
<fx:Script> 
<![CDATA[ 
import flash.external.*; //引入ExternalInterface 
public function initApp():void 
{ 
ExternalInterface.addCallback("myJsFunction",myAsFuncn); 
button.addEventListener(MouseEvent.CLICK,buttonClick); 
} 
public function myAsFuncn(js:String):String 
{ 
return "js:"+js+"访问了as:"+asInput.text; 
} 
private function buttonClick(event:MouseEvent):void 
{ 
trace(asInput.text); 
label.text = "as 调用 js ..."; 
var result:String = callJS(asInput.text); 
label.text = "返回值:" + result; 
} 
private function callJS(arg:String):String 
{ 
return ExternalInterface.call("jsMethod",arg); 
} 
private function asMethod(arg:String):String 
{ 
label.text = arg; 
return "js 调用了 as 成功!"; 
} 
]]> 
</fx:Script> 
<s:VGroup width="100%" height="100%"> 
<s:VGroup width="100%"> 
<mx:Button x="169.5" y="162" label="点击" fontSize="14" id="button"/> 
<mx:TextInput id="asInput" x="122" y="76"/> 
<s:Label id="label"/> 
</s:VGroup> 
</s:VGroup> 
<code:IFrame source="MyHtml.html" width="500" height="500"/> 
</s:Application>

html页面:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>MyHtml.html</title> 
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
<script language="JavaScript"> 
function callAs( ) 
{ 
var myFlexfun=document.getElementById("myFlexFun"); 
var result=myFlexfun.myJsFunction(jsinput.value); 
alert(result); 
mess.value=result; 
} 
function jsMethod(arg) { 
alert("as 调用 js 成功,参数为:" + arg); 
return ("as 调用 js 成功!"); 
} 
</script> 
</head> 
<body> 
<table> 
<tr> 
<td> 
<object id= "myFlexFun" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="400" height="300"> 
<param name="movie" value="test.swf" /> 
<param name="quality" value="high" /> 
<embed src="test.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="400" height="300"></embed> 
</object> 
</td> 
</tr> 
<tr> 
<td> 
<input type="input" id="jsinput"/> 
<input type="button" value="点我看效果" onclick="callAs()"/> 
<input type="input" id="mess"/> 
</td> 
</tr> 
</table> 
</body> 
</html>

Actionscript与javascript交互实例程序(修改)

如果试过以上的方法,会发现在被嵌入的Html见面中又嵌入了一个父级的swf文件,如下

Actionscript与javascript交互实例程序(修改)

这种情况显然不是我想要的结果。于是修改下代码,如下:

mxml页面

<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" 
width="100%" height="100%" xmlns:code="http://code.google.com/p/flex-iframe/" 
creationComplete="initApp()"> 
<fx:Declarations> 
<!-- 将非可视元素(例如服务、值对象)放在此处 --> 
</fx:Declarations> 
<fx:Script> 
<![CDATA[ 
import flash.external.*; 
import mx.controls.Alert; 
import mx.rpc.events.ResultEvent; //引入ExternalInterface 
public function initApp():void 
{ 
ExternalInterface.addCallback("sayCallBack",callBack); 
} 
public function callBack(str:String):String{ 
return "Hello "+str; 
} 
protected function button1_clickHandler(event:MouseEvent):void 
{ 
ExternalInterface.call('sayHelloWorld',' Jim'); 
var array:Array = new Array(); 
array.push("a", "b","c","d","e"); 
myIFrame.callIFrameFunction('jsMethod',array,function(str:String):void{ 
label.text=str; 
}); 
} 
public static function str():String{ 
return "aaa"; 
} 
]]> 
</fx:Script> 
<s:VGroup width="100%" height="100%"> 
<s:BorderContainer width="100%" height="300" backgroundColor="#00ffaa"> 
<s:HGroup width="100%"> 
<s:Button label="调用js" click="button1_clickHandler(event)"/> 
<mx:Button x="169.5" y="162" label="点击" fontSize="14" id="button"/> 
<mx:TextInput id="asInput" x="122" y="76"/> 
<s:Label id="label"/> 
</s:HGroup> 
</s:BorderContainer> 
<s:BorderContainer width="100%" height="300"> 
<code:IFrame id="myIFrame" source="com/MyHtml.html" width="100%" height="100%"/> 
</s:BorderContainer> 
</s:VGroup> 
</s:Application>

html页面:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>MyHtml.html</title> 
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
<script language="JavaScript"> 
function callAs( ) 
{ 
var ifrm =window.parent.xiSwfUrlStr; 
if (ifrm) 
{ 
alert(ifrm); 
}else{ 
alert('false'); 
} 
} 
function jsMethod(arr) { 
alert("as 调用 js 成功,参数为:"+arr[4]); 
return ("as 调用 js 成功!"); 
} 
function callA(){ 
var str=window.parent.document.getElementById("test").sayCallBack("Bill"); 
if (str) 
{ 
alert(str); 
mess.value=str; 
}else{ 
alert('false'); 
} 
} 
</script> 
</head> 
<body> 
<table> 
<tr> 
<td > 
<object id= "myFlexFun" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%"> 
<param name="movie" value="../test.swf" /> 
<param name="quality" value="high" /> 
</object> 
</td> 
</tr> 
<tr> 
<td> 
<input type="input" id="jsinput"/> 
<input type="button" value="点我看效果" onclick="callA()"/> 
<input type="input" id="mess"/> 
</td> 
</tr> 
</table> 
</body> 
</html>

这样,html的js脚本就可以直接调用as脚本,而不需要再次嵌入swf文件。

以上所述是小编给大家介绍的Actionscript与javascript交互实例程序(修改),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
图片Slider 带左右按钮的js示例
Aug 30 Javascript
用JS做的简单的可折叠的两级树形菜单
Sep 21 Javascript
js判断浏览器类型为ie6时不执行
Jun 15 Javascript
javascript同步服务器时间和同步倒计时小技巧
Sep 24 Javascript
学习JavaScript设计模式之模板方法模式
Jan 20 Javascript
javascript 常用验证函数总结
Jun 28 Javascript
Bootstrap导航条的使用和理解3
Dec 14 Javascript
vue双向绑定简要分析
Mar 23 Javascript
jQuery回调方法使用示例
Jun 26 jQuery
AngularJS实现的鼠标拖动画矩形框示例【可兼容IE8】
May 17 Javascript
JS前端面试必备——基本排序算法原理与实现方法详解【插入/选择/归并/冒泡/快速排序】
Feb 24 Javascript
jQuery实现移动端图片上传预览组件的方法分析
May 01 jQuery
Javascript 调用 ActionScript 的简单方法
Sep 22 #Javascript
JavaScript与ActionScript3两者的同性与差异性
Sep 22 #Javascript
ionic由于使用了header和subheader导致被遮挡的问题的两种解决方法
Sep 22 #Javascript
自制微信公众号一键排版工具
Sep 22 #Javascript
IONIC自定义subheader的最佳解决方案
Sep 22 #Javascript
详解Node.js中的事件机制
Sep 22 #Javascript
AngularJS通过$sce输出html的方法
Sep 22 #Javascript
You might like
逐步提升php框架的性能
2008/01/10 PHP
PHP Mysql编程之高级技巧
2008/08/27 PHP
zend api扩展的php对象的autoload工具
2011/04/18 PHP
php判断页面是否是微信打开的示例(微信打开网页)
2014/04/25 PHP
php实现的IMEI限制的短信验证码发送类
2015/05/05 PHP
PHP实现微信JS-SDK接口选择相册及拍照并上传的方法
2016/12/05 PHP
微信JSSDK分享功能图文实例详解
2019/04/08 PHP
IE iframe的onload方法分析小结
2010/01/07 Javascript
为jQuery.Treeview添加右键菜单的实现代码
2010/10/22 Javascript
基于jQuery实现左右div自适应高度完全相同的代码
2012/08/09 Javascript
Javascript和Java获取各种form表单信息的简单实例
2014/02/14 Javascript
Dojo Javascript 编程规范 规范自己的JavaScript书写
2014/10/26 Javascript
node.js中的querystring.escape方法使用说明
2014/12/10 Javascript
你所不了解的javascript操作DOM的细节知识点(一)
2015/06/17 Javascript
require.js的用法详解
2015/10/20 Javascript
js判断手机访问或者PC的几个例子(常用于手机跳转)
2015/12/15 Javascript
JavaScript代码实现左右上下自动晃动自动移动
2016/04/08 Javascript
深入理解jQuery 事件处理
2016/06/14 Javascript
echarts学习笔记之箱线图的分析与绘制详解
2017/11/22 Javascript
Vue.js组件间的循环引用方法示例
2017/12/27 Javascript
webpack实现一个行内样式px转vw的loader示例
2018/09/13 Javascript
[01:53]DOTA2超级联赛专访Zhou 五年职业青春成长
2013/05/29 DOTA
[01:10:58]KG vs TNC 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python多进程中的内存复制(实例讲解)
2018/01/05 Python
python中plot实现即时数据动态显示方法
2018/06/22 Python
对python 中re.sub,replace(),strip()的区别详解
2019/07/22 Python
python opencv鼠标事件实现画框圈定目标获取坐标信息
2020/04/18 Python
Python合并2个字典成1个新字典的方法(9种)
2019/12/19 Python
python如何支持并发方法详解
2020/07/25 Python
Java如何格式化日期
2012/08/07 面试题
教师党员思想汇报
2014/01/06 职场文书
学生党支部先进事迹
2014/02/04 职场文书
yy生日主持词
2014/03/20 职场文书
公务员更新知识培训实施方案
2014/03/31 职场文书
大学理论知识学习自我鉴定
2014/04/28 职场文书
浅谈Redis位图(Bitmap)及Redis二进制中的问题
2021/07/15 Redis