酷知百科網

位置:首頁 > 遊戲數碼 > IT技術

如何使用EasyUI生成彈窗介面

IT技術1.4W

我們在進行頁面製作的時候,經常會需要製作彈窗介面,那麼如何使用EasyUI製作彈窗介面呢?下面小編給大家分享一下。

工具/材料

Eclipse

操作方法

首先我們在Eclipse中新建一個Web項目,然後匯入EasyUI的庫檔案夾,如下圖所示

如何使用EasyUI生成彈窗介面

接下來新建一個HTML5檔案,主要在這個檔案中進行彈窗的製作,如下圖所示

如何使用EasyUI生成彈窗介面 第2張

然後在HTML5介面中先匯入Jquery腳本,接着在匯入easyui的腳本檔案,如下圖所示

如何使用EasyUI生成彈窗介面 第3張

接下來我們運用link元素匯入easyui的樣式檔案,如下圖所示

如何使用EasyUI生成彈窗介面 第4張

接着如果介面中有中文內容的話,還需要匯入easyui的中文腳本檔案,如下圖所示

如何使用EasyUI生成彈窗介面 第5張

然後我們在body區域中添加一個div,給div一個easyui-dialog的樣式,如下圖所示

如何使用EasyUI生成彈窗介面 第6張

接着我們執行介面,你就會看到一個easyui的彈窗介面就製作好了,如下圖所示

如何使用EasyUI生成彈窗介面 第7張

最後我們還可以在JS腳本中手動控制easyui彈窗的生成,主要是透過dialog方法實現的,如下圖所示

如何使用EasyUI生成彈窗介面 第8張
標籤:EasyUI 彈窗 介面