關於easyUI中彈窗的問題
阿新 • • 發佈:2018-11-11
先上程式碼,再說其中的奧祕! 彈窗應該是啟動最裡面的div或iframe才對,你啟動外面的可能不是你所要的效果 。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>easyui 中iframe巢狀頁面,https://www.cnblogs.com/baiyangyuanzi/p/6625744.html</title> <!--要下載easyUI框架,然後加入本檔案中,只要加兩個就可以了--> <link rel="stylesheet" type="text/css" href="jquery-easyui-1.6.2/themes/default/easyui.css"> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.easyui.min.js"></script> <script type="text/javascript"> $(function(){ <!--s1的點選事件--> $('#s1').click(function(){ <!--得到s1中的值--> var $t1=$('#s1').html(); $("#wind").window({ //注意彈窗的啟動方法是很有講究的,你啟動外層的div,那麼裡層的iframe就變成圖 1一樣的了,不好看; title:$t1, //彈窗的標題 width:700, //寬度 height:550, //高度 modal:true //模態對話方塊 }); }); $('#s2').click(function(){ var $t2=$('#s2').html(); $("#wind_1").window({ //注意它啟動的是div之中的iframe框架,所以彈窗內就充滿了這個框架網面的全部內容。好看。 title:$t2, width:700, height:550, modal:true }); }); }); </script> <style type="text/css"> #wind{ display:none; <!-- 這一句一定要有,是指剛開始時,將彈窗隱藏--> } </style> </head> <body> <section id="s1">這是一句</section> <section id="s2">這是二句</section> <div id="wind" title="彈窗"> <iframe id="wind_1" name="wind_1" src="openW.html"></iframe> </div> </body> </html>
注意哦!在同一個頁面中啟動彈窗的時候,你會發現,它居然總是第一次的彈窗值,這個時候,你就要使用一個重新整理的語句。
window.wind_1.location.reload();
圖1
圖2: