easyui dialog 中嵌入html頁面


最近使用easyui比較多,這個插件確實很好用。在使用時也遇到了大大小小的問題,好在都一一解決了。

記錄一下今天遇到的問題。

目的:用easyui的dialog嵌入一個html頁面(html中仍有要執行的腳本內容)

方法一:

使用href屬性,失敗。

經過測試,如果easyui dialog的地址屬性用href超鏈接,easyui 不會加載整個url頁面,只會截取url目標頁的body體間的html。

easyui官網上關於href屬性的說明是:

屬性href,類型string,一個URL,用它加載遠程數據並且顯示咋面板(panel)里。請注意,除非面板(panel)打開,否則內容不會被加載。這對創建一個惰性加載的面板(panel)很有用。

(惰性加載面板本人不太理解)

方法二:

使用content屬性,成功。

html代碼:

 

1 <div id="dialog"  class="easyui-dialog" closed="true"></div>

 

js代碼:

1 $("#dialog").dialog({
2     title:'your title'3     width:1000,
4     height:600,
5     modal:true,
6     content:"<iframe scrolling='auto' frameborder='0' src='aaa.html' style='width:100%; height:100%; display:block;'></iframe>"
7 });
$("#dialog").dialog("open"); // 打開dialog

成功!

注意:用此種方式的時候,在html代碼的<div>中必須寫class="easyui-dialog"這個屬性。否則會彈出很多錯誤。

2017-11-06 15:15:39

 


免責聲明!

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



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