其实在试验中，发现IE浏览器是没有问题的，倒是Firefox和Chrome等不可以，发现隐藏swf对象后，再显示时，IE上不会出现重载swf的情况，但是Firefox和Chrome都有重载swf文件的情况，于是想办法让后者浏览器不要重载，于是找到把flex这个object的style中，将其visibility设置成"hidden"，且长宽均为0的办法，实验证明果然可以了，解决了不同浏览器不兼容的情况。
代码如下，主要是JavaScript的处理，所以在此不给出Flex的源码。
另外，要注意以前由于Adobe的Flex-Ajax Bridge不考虑Chrome浏览器导致Flex与JavaScript不能交互的情况，要在FABridge.js文件中的FABridge__bridgeInitialized时加入如下判断：
if((!(/Chrome/.test(navigator.appVersion))) && ((/Explorer/.test(navigator.appName) || /Konqueror|Safari|KHTML/.test(navigator.appVersion))))
示例代码如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test page for the TimeLine3 class</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="lib/FABridge.js"></script>
<script type="text/javascript" src="TimeLine3.js"></script>
<script type="text/javascript">
function SetData1() {
// 取得Flex应用模块中的具体组件
var column = TimeLine3.getZ_data();
// JavaScript准备数据
var dp = [];
dp.push( {z_name: '2011-01-05', z_value02: 37, z_value01: 28} );
dp.push( {z_name: '2011-01-06', z_value02: 34, z_value01: 37} );
dp.push( {z_name: '2011-01-07', z_value02: 45, z_value01: 43} );
dp.push( {z_name: '2011-01-08', z_value02: 41, z_value01: 44} );
// 设置Flex应用模块中组件的属性
column.setSource(dp);
}
function SetData2() {
// 取得Flex应用模块中的具体组件
var column = TimeLine3.getZ_data();
// JavaScript准备数据
var dp = [];
dp.push( {z_name: '2011-04-02', z_value02: 34, z_value01: 38} );
dp.push( {z_name: '2011-04-03', z_value02: 24, z_value01: 67} );
dp.push( {z_name: '2011-04-04', z_value02: 55, z_value01: 13} );
dp.push( {z_name: '2011-04-05', z_value02: 71, z_value01: 44} );
// 设置Flex应用模块中组件的属性
column.setSource(dp);
}
function HideFlex(_flex_id_, _height_, _width_)
{
document.getElementById(_flex_id_).style.visibility="hidden";
document.getElementById(_flex_id_).style.height = _height_;
document.getElementById(_flex_id_).style.width = _width_;
}
function ShowFlex(_flex_id_, _height_, _width_)
{
document.getElementById(_flex_id_).style.visibility="visible";
document.getElementById(_flex_id_).style.width = _height_;
document.getElementById(_flex_id_).style.height = _width_;
}
</script>
</head>
<body>
<input type="button" value="数据1" onclick="SetData1()" />
<input type="button" value="数据2" onclick="SetData2()" />
<input type="button" value="隐藏" onclick="HideFlex('TimeLine3Test', 0, 0)" />
<input type="button" value="显示" onclick="ShowFlex('TimeLine3Test', 960, 320)" />
<div id="div_timeline3" name="div_timeline3" >
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
id="TimeLine3Test" width="960" height="320"
codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
<param name="movie" value="../TimeLine3.swf" />
<param name="flashvars" value="bridgeName=b_TimeLine3"/>
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="allowScriptAccess" value="sameDomain" />
<embed src="../TimeLine3.swf" quality="high"
width="960" height="320" name="TimeLine3Test"
align="middle"
play="true"
loop="false"
quality="high"
allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.adobe.com/go/getflashplayer"
flashvars="bridgeName=b_TimeLine3">
</embed>
</object>
</div>
</body>
</html>
因为不能上传Flex文件演示，只好截几个图来看一下效果：
用于chrome浏览器：
用于firefox浏览器：
用于IE浏览器：
