Easyui彈出窗體在iframe的父級頁面顯示


今天做EasyUI學習的預到了一個這樣的問題:通過iframe加載的一個頁面在調用$.messager.alert();這個方法后只能在iframe中顯示alert效果而不是在全局的頁面上顯示這並不我要的效果:經過查找解決方法如下:

演示頁面:

iframemessager.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" />
<title>EasyUI 初步 -iframe窗口</title>
<!-- easyUI必須引入的文件 S -->
<link rel="stylesheet" type="text/css" href="../easyui/themes/default/easyui.css"/>  
<link rel="stylesheet" type="text/css" href="../easyui/themes/icon.css"/> 
<script type="text/javascript" src="../easyui/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../easyui/locale/easyui-lang-zh_CN.js"></script> 
<script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
<!-- easyUI必須引入的文件 E -->
</head>
<body>
    <iframe scroll="no" frameborder="2" src="messager.html" style="margin:20px;width:400px;height:400px;"</iframe>
</body>
</html>

子頁面messager的頁面代碼:

<!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>EasyUI 初步 -iframe彈出messager</title>
<!-- easyUI必須引入的文件 S -->
<link rel="stylesheet" type="text/css" href="../easyui/themes/default/easyui.css"/>  
<link rel="stylesheet" type="text/css" href="../easyui/themes/icon.css"/> 
<script type="text/javascript" src="../easyui/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../easyui/locale/easyui-lang-zh_CN.js"></script> 
<script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
<!-- easyUI必須引入的文件 E -->
</head>
<body>
    <a href="#" class="easyui-linkbutton" style="margin:20px" onclick="msg()">彈出提示</a>
    <script type="text/javascript">
        function msg(){
            parent.$.messager.alert('操作提示','提示的內容');
        }
    </script>



</body>
</html>

注:在本地測試下IE瀏覽器是沒有任何的安全問題的,但是在webkit內核的瀏覽器(包括Chrome、搜狗、360、獵豹、遨游等)都會提示如下的錯誤

image

經過查找后:原因是因為webkit內核瀏覽器的本地安全問題所導致的,解決的方法很容易就是把對應的頁面放在服務器下就行了,如IIS、Tomcat就不會出現了!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM