1. 程式人生 > >artDialog簡單使用中iframe的穿透

artDialog簡單使用中iframe的穿透

包含iframe的頁面,注意需要引用artDialog檔案,否則好像不能實現穿透效果 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Developing......</title><script src="artDialog/artDialog.js?skin=default"></script>
<script src="test.js?a=2011"></script> </head> <body><div id="cuowu">err</div> <form id="form1" name="form1" method="post" action="a.asp" onsubmit="return doValidate(this);"> <table width="331" height="167" border="1" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="130" align="right"> </td> <td width="195"> </td> </tr> <tr> <td align="right">賬號:</td> <td><input type="text" name="xingming" id="xingming" /></td> </tr> <tr> <td align="right">密碼:</td> <td><input type="text" name="pid" id="pid" /></td> </tr> <tr> <td colspan="2" align="center"><input type="submit" name="button" id="button" value="提交" /> </td> </tr> </table>
<iframe src="suoping.html" width="100%" height="400"></iframe>
</form>
</body>
</html>

以下是iframe頁suoping.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="artDialog/artDialog.js?skin=default"></script>
<script src="artDialog/plugins/iframeTools.js"></script>

</head>

<body><form id="form2" name="form2" method="post" action="a.asp" onsubmit="return doValidate(this);">
<table width="331" height="167" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="130" align="right">&nbsp;</td>
    <td width="195">&nbsp;</td>
  </tr>
  <tr>
    <td align="right">賬號:</td>
    <td><input type="text" name="xingming" id="xingming" /></td>
  </tr>
  <tr>
    <td align="right">密碼:</td>
    <td><input type="text" name="pid" id="pid" /></td>
  </tr>
  <tr>
    <td colspan="2" align="center"><input type="submit" name="button" id="button" value="提交" />
      &nbsp;
      <input type="button" name="button2" id="button2" value="按鈕" onclick="getNowURL();" />
      &nbsp;
      <input type="button" name="button3" id="button3" value="Alert" onclick="Alert();" /></td>
    </tr>
</table></form>
 <input type="button" name="button3" id="button3" value="Alert2011" onclick="test();" />
 <input type="button" name="button3" id="button3" value="Tips" onclick="testtips();" />
<script>  
   function test(){
/*art.dialog.through({ lock: true, //background: '#600', // 背景色
 //opacity: 0.7, // 透明度
  content: '中斷使用者在對話方塊以外的互動,展示重要操作與訊息', icon: 'error', yesFn: function () { art.dialog({content: '再來一個鎖屏', lock: true}); return false; }, noFn: true });*/
  art.dialog.load('index.html',{title:'denglu',lock:true});
   }
     function testtips(){
/*art.dialog.through({ lock: true, //background: '#600', // 背景色
 //opacity: 0.7, // 透明度
  content: '中斷使用者在對話方塊以外的互動,展示重要操作與訊息', icon: 'error', yesFn: function () { art.dialog({content: '再來一個鎖屏', lock: true}); return false; }, noFn: true });*/
  art.dialog.tips('tips');
   }
   </script> 

</body>
</html>